为什么获胜';t JS/JQuery读取文本框值

本文关键字:读取 JQuery 取文本 JS 获胜 为什么 | 更新日期: 2023-09-27 18:22:15

我已经到处找了这个代码不起作用的原因,我被难住了。

我有一个ASPX页面,后面有C#代码。HTML标记有一个JQuery对话框,可以正常工作。单击提交按钮后,对话框将关闭,数据将传递给web公开的方法并写入数据库。保存ddl和chkbox控件的所有值,但文本框的字符串值为空。对于文本框正在填充的字段,数据库被设置为NOT NULL,并且数据正在保存,所以我知道数据正在传递,但它不是输入到文本框中的值。

文本框ID为txtCategoryName,客户端ID模式设置为静态。我尝试使用以下方法获取值:

var CategoryName = $('#txtCategoryName').val();
var CategoryName = $('#txtCategoryName').text();
var CategoryName = $(document.getElementById('txtCategoryName')).text();
var CategoryName = $(document.getElementById('txtCategoryName')).val();
var CategoryName = document.getElementById('txtCategoryName').value;

所有这些都返回相同的空白字段。我一次试一个。目前我正在使用这个JS代码:

$(document).ready(function () {
var CategoryDialog = $(".EditCategories");
var BtnNew = $("#btnNew");
var CatDDL = document.getElementById("ddlCategoryParent3");
var CatChk = $("#chkCatActive").val();
var CategoryID = 0;
var CategoryName = $("#txtCategoryName").val();
var ParentID = CatDDL.options[CatDDL.selectedIndex].value;
if (CatChk) { CatChk = 1; } else { CatChk = 0; }

var CatDialog = $(CategoryDialog.dialog({
    maxHeight: 1000,
    closeOnEscape: true,
    scrollable: false,
    width: 650,
    title: 'Category Editor',
    autoOpen: false,

    buttons: [
        {
            width: 170,
            text: "Save",
            icons: {
                primary: "ui-icon-disk"
            },
            click: function () {
                $(this).dialog("close");
                window.alert(PageMethods.saveCat(CategoryName, ParentID, CategoryID, CatChk));
            }
        },
        {
            width: 170,
            text: "Delete",
            icons: {
                primary: "ui-icon-circle-minus"
            },
            click: function () {
                $(this).dialog("close");
            }
        },
        {
            width: 170,
            text: "Cancel",
            icons: {
                primary: "ui-icon-circle-close"
            },
            click: function () {
                $(this).dialog("close");
            }
        }
    ]
})



);

BtnNew.click(function () {
    $(CatDialog).dialog('open');
    $(CatDialog).parent().appendTo($("form:first"));
});


});

aspx页面(categories.aspx)的代码标记

<div class="EditCategories">
    <div class="Table">
        <div class="TableRow">
                <div class="TableCell">
                           <div class="TextBlock220">Category Name </div>
                </div><!-- End Table Cell -->
                <div class="TableCell">
                    <input id="txtCategoryName" class="ControlTextBox" />
                    <!--<asp:TextBox ID="txtCategoryName" CssClass="ControlTextBox" runat="server" ClientIDMode="Static"></asp:TextBox>-->
                 </div><!--End Table Cell-->
             </div><!-- End Row 1 -->
         <div class="TableRow">
               <div class="TableCell">
                           Parent Category
               </div><!-- End Table Cell -->
               <div class="TableCell">
                    <asp:DropDownList ID="ddlCategoryParent3" runat="server" CssClass="ControlDropDownList" ClientIDMode="Static"></asp:DropDownList>
               </div><!--End Table Cell-->
         </div>
         <div class="TableRow">
                    <div class="TableCell">
                          Active
                    </div><!-- End Table Cell -->
                    <div class="TableCell">
                          <asp:Checkbox ID="chkCatActive"      CssClass="ControlCheckBox" runat="server" ClientIDMode="Static"></asp:Checkbox>
                    </div><!--End Table Cell-->
         </div><!-- End Row 3-->

        </div>
</div>

ASPX页面的C#代码隐藏方法:

[System.Web.Services.WebMethod()]
[System.Web.Script.Services.ScriptMethod()]
public static string saveCat(string _Name_, int _parent_id_, int ID, int _Status_)
{
    Category eCT = new Category();
    eCT.CategoryName = _Name_;
    eCT.ParentID = _parent_id_;
    eCT.ID = ID;
    eCT.Status = _Status_;
    eCT.Save();
    return eCT.resultMessage; 
}

保存方法:

/// <summary>
/// If the ID = 0 the data is written as a new category.
/// If the ID is greater than 0 the data is updated.
/// </summary>
/// <returns>The objects result value will hold the result of the attempt to update data as type Boolean.  The objects resultMessage value will contain the string result of the attempt to add data.</returns>
public void Save()
{
    result = dl.CategoryExists(this);
    if (result) { resultMessage = "The parent category already contains a category named " + CategoryName.Trim(); }
    else { 
        if (ID > 0)
        {
            if (!result) { resultMessage = "There was an unexpected error updating " + CategoryName.Trim() + ". No changes were saved."; }
        }
        else
        {
            result = dl.InsertCategory(this);
            if (!result) { resultMessage = "There was an unexpected error creating the Category."; }
        }
    }
    if (result) { resultMessage = "New Category Successfully Created"; }
}

非常感谢您的帮助。

为什么获胜';t JS/JQuery读取文本框值

这里的问题是,您试图在页面加载后,在填写输入字段之前,立即获取正确的值。将此代码放入按钮点击功能:

var CategoryName = document.getElementById('txtCategoryName').value;

它应该对你有用。如果没有,请告诉我们。

您的代码应该如下所示:

       click: function () {
            // note: CategoryID not used yet.
            var CategoryName = $("#txtCategoryName").val();
            var CatChk = $("#chkCatActive").val();
            var CatDDL = document.getElementById("ddlCategoryParent3")
            var ParentID = CatDDL.options[CatDDL.selectedIndex].value;
            if (CatChk) { CatChk = 1; } else { CatChk = 0; }
            $(this).dialog("close");
            window.alert(PageMethods.saveCat(CategoryName, ParentID, CategoryID, CatChk));
        }

您在页面启动时从对话框中获取值,然后再对其进行编辑。

它看起来像这样:

var CategoryName = $("#txtCategoryName").val();

在页面编辑之前的页面启动时运行。这将获取输入字段的默认值,并且永远不会反映在页面上进行的任何编辑。上面的代码行不会创建与页面上的输入字段的"实时"连接。它只是在代码行运行时获得值,从那时起,就不会与对字段进行的任何编辑相连接。

我认为只有当你真正需要对某个东西进行估价时,你才想稍后获取该值。通常,您不希望缓存这样的值,因为缓存的值与页面上实际字段中的值不同步。只要在你需要它的时候把它拿出来,它就永远不会有过时的价值。

如果你使用这个值的地方在对话框点击处理程序中,那么在那里获取它,这样你就得到了最新的值:

        click: function () {
            $(this).dialog("close");
            var CatChk = $("#chkCatActive").val() ? 1 : 0;
            var CategoryName = $("#txtCategoryName").val(); 
            var CatDDL = document.getElementById("ddlCategoryParent3");
            var ParentID = CatDDL.options[CatDDL.selectedIndex].value;               
            window.alert(PageMethods.saveCat(categoryName, ParentID, CategoryID, CatChk));
        }