Question

我需要先使用'远程'方法检查公司名称的可用性，然后再继续插入上述公司

我目前正在使用jquery UI Dialog输入公司的数据，因为我需要在同一页面上进行，然后列出所有公司

目前我或多或少都在工作，但没有预期，因为远程方法只是第一次工作，下次我尝试打开对话框并尝试输入已存在的名称时，“远程”方法只是不再起作用了，我不知道这是什么原因。

编辑：我会试着看看能否解释一下

假设我有2家注册公司： company1 和 company2

第一次加载页面时我打开对话框尝试重新输入让我们说：'company2'，'remote'方法正常工作（The 仅当'txtName'失去焦点时才会调用WebMethod，每次更改内容时都会调用它。我想这是正常的行为，不是吗？
如果我更改了文字，让我们说，我输入'company20'，注册公司之间不存在，这次是公司已正确注册。
当再次尝试重新输入上一个值（ company20 ）时会出现问题，在这种情况下，WebMethod不再呼叫，允许您注册'company20'，再次注册不存在，这不是真的。就好像保留了'company20' 作为有效值，从第一次打开对话框开始，但是，如果我输入另一个值，那么确实存在，例如 company1 或 company2 ，'remote'方法再次正常运行。

我不知道我是否已经解释得很好，因为即使对我来说这也很令人困惑，但我希望你能理解我，并且你可以帮助我。

以下是我使用的所有 javascript ：

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">

    <script type="text/javascript">
     $(document).ready(function() {     

            var dialogFormValidator= $("#form2").validate({
                 rules: {
                   txtName: {
                      required: true,
                      remote: function(){
                        var result={
                            type: "POST", 
                            url: "RemoteMethod.aspx/IsUnique",
                            data: "{'name': '" + $('#txtName').val() + "'}" ,
                            contentType: "application/json; charset=utf-8",  
                            dataType: "json",                              
                            dataFilter: function(data) { 
                                  var x = (JSON.parse(data)).d;
                                  return JSON.stringify(x); 
                            }  

                        }
                        return result;
                      }
                  },
                  txtAddress: {
                      required: true
                  }
               },
               messages :{
                 txtName : {       
                    remote: " That name is already taken,please enter a different one."
                 }               

               }

            });
            $("#dialog-form").dialog({
                autoOpen: false,
                width: 350,
                height: 290,
                modal: true,
                beforeClose: function(event, ui) { 
                    $("#txtName").val("");
                    $("#txtAddress").val("");   
                    dialogFormValidator.resetForm();                    

                },
                buttons:
                {
                    "Add": function() {

                        var valid = dialogFormValidator.form(); 
                        if (valid) {
                            var name = $("#txtName").val();
                            var address = $("#txtAddress").val();


                            var params = new Object();
                            params.name = name;
                            params.address = address;
                            params = JSON.stringify(params);

                            $.ajax({
                                type: 'POST',
                                url: 'RemoteMethod.aspx/AddNewItem',
                                data: params,
                                contentType: "application/json; charset=utf-8",
                                dataType: "json",
                                success: function(msg) {
                                    if (msg.d) {

                                        <%=ClientScript.GetPostBackEventReference(UpdatePanel1,"") %>;
                                        $("#dialog-form").dialog("close");

                                    }
                                },
                                error: function(XMLHttpRequest, textStatus, errorThrown) {
                                    alert(textStatus + ": " + XMLHttpRequest.responseText);
                                }
                            });
                         } 


                        },
                        "Cancel": function() {                           
                            $(this).dialog("close");
                        }
                    }
            });

            $("#add").click(function(event) {
                event.preventDefault();
                $("#dialog-form").dialog("open");
            });
        });

    </script>    
</asp:Content>

正如您所看到的，一旦满足所有验证，我立即通过javascript刷新UpdatePanel的内容（我向所有现有公司展示的网格视图）。（我为了简单起见使用了UpdatePanel）

此处还有用于检查公司名称可用性的WebMehod：

 <WebMethod()> _
    Public Shared Function IsUnique(ByVal name As String) As Boolean
        Dim count As Integer = 0
        Using cn As New SqlConnection(My.Settings.Conexion.ToString())
            Dim sql As String = "SELECT COUNT(*) FROM Companies WHERE Name=@Name"
            cn.Open()
            Dim cmd As New SqlCommand(sql, cn)
            cmd.Parameters.AddWithValue("@Name", name)
            count = Convert.ToInt32(cmd.ExecuteScalar())
            cn.Close()
        End Using
        If count Then
            Return False
        Else
            Return True
        End If

    End Function

编辑：ASP.net标记：

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div>
        <a href="#" id="add">Add New</a>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <asp:GridView ID="gvSucursales" runat="server" AutoGenerateColumns="False" 
                    DataKeyNames="Id">                  
                    <Columns>
                        <asp:BoundField DataField="Id" HeaderText="Id">
                            <ItemStyle Width="50px" />
                        </asp:BoundField>
                        <asp:BoundField DataField="Nombre" HeaderText="Name">
                            <ItemStyle Width="200px" />
                        </asp:BoundField>
                        <asp:BoundField DataField="Direccion" HeaderText="Address">
                            <ItemStyle Width="300px" />
                        </asp:BoundField>
                    </Columns>                  
                </asp:GridView>
            </ContentTemplate>
        </asp:UpdatePanel>
    </div>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder2" runat="server">
    <div id="dialog-form" title="Add new Company">
        <p>
            All the fields are required.</p>
        <form id="form2">
        <table>
            <tr>
                <td>
                    <label for="txtName" id="lblName">
                        Name</label>
                </td>
                <td>
                    <input type="text" name="txtName" id="txtName" class="text ui-widget-content ui-corner-all" />
                </td>
            </tr>
            <tr>
                <td>
                    <label for="txtAddress" id="lblAddress">
                        Address</label>
                </td>
                <td>
                    <input type="text" name="txtAddress" id="txtAddress" class="text ui-widget-content ui-corner-all" />
                </td>
            </tr>
        </table>
        </form>
    </div>
</asp:Content>

关于如何解决这个问题的任何想法都将非常感激

Answer 1

我怀疑这个插件似乎缓存了这个值，并且发现了一点点我发现我可以使用removeData("previousValue")手动使缓存失效，而这正是我所做的：

$("#txtName").change(function () {
    $("#txtName").removeData("previousValue");
});

猜猜是什么......？ 有效！

Answer 2

首先，我有一个问题：您的AddNewItem页面方法是否被点击？

我根据你的代码创建了一个小项目。对我来说，IsUnique的电话一直都没问题。我在调用AddNewItem页面方法时遇到了麻烦，但总是返回Internal 500 Error。

将params对象传递给AddNewItem方法的方式不正确。您的代码将生成如下的json字符串：

var params = new Object();
params.name = name;
params.address = address;
params = JSON.stringify(params);

// params => '{"name": "xxx", "address": "ndndnd"}'

但是asp.net期望这样：'{"params": {"name": "xxx", "address": "ndndnd"}}'（假设AddNewItem的参数被称为“params”。

var oParams = new Object();
oParams.name = name;
oParams.address = address;

var oData = { 'params' : oParams };

$.ajax({
   ...
   data: JSON.stringify(oData),
   ...
});

更改后，我的项目按预期工作，我可以添加新项目，IsUnique会考虑添加的项目。

希望这是你问题的解决方案...... 告诉它是否不符合您的需求

使用远程验证规则和.form（）

“添加”按钮处理程序中也存在可能的缺陷。你这样做：

 var valid = dialogFormValidator.form(); 
 if (valid) {

问题是远程规则需要一段时间才能执行，并且在完全执行之前，该字段将被视为有效。

在远程规则执行结束之前，if (valid)为true，并且如果它实际上使该字段无效，则为时已晚。

我发现了一篇关于此问题的文章：https://stackoverflow.com/...jquery-validation-waiting-for-remote-check-to-complete

我对文章中提出的while（）解决方案并不满意，但它可以为您提供想法。

jQuery Validate在jQuery UI Dialog中的远程方法只能运行一次

2 个答案: