0

我对按钮单击事件触发有疑问。我在同一个视图上有两个按钮,但由于某种原因,一个按钮单击后,另一个按钮单击事件不会触发。你能帮忙吗?如果您在 copydata 按钮单击后看到下面的 getdata 按钮单击不会触发。

<div id ="MainDiv">
    <table>
        <tr>
            <td>
                <h4> Please Select the Environment :</h4>
            </td>
        </tr>
        <tr>
            <td>
                @Html.DropDownList(
                    "SelectedEnvironmentID",
                    new SelectList(
                        Model.EnvironmentViewModel.Select(x => new { Value = x.Id, Text =  
                        x.Name }),
                        "Value",
                        "Text"), new { @onchange = "HideElements()" }
                    )
            </td>
        </tr>
        <tr>
            <td>
                <h4> Please Select the Version :</h4>
            </td>
        </tr>
        <tr>
            <td>
                @Html.DropDownList(
                    "SelectedVersionID",
                    new SelectList(
                        Model.VersionsModel.Select(x => new { Value = x.Id, Text = x.Number }),
                        "Value",
                        "Text"), new { @onchange = "HideElements()" }
                    )
            </td>
        </tr>
        <tr>
            <td>
                <input id="getData" name="ViewServerData" type="submit" value="View Profiles" />
            </td>
        </tr>

    </table>
</div>

 <p></p>   

 <div id ="ProfileCopyDiv" class="Copy" >
    <table>
        <tr>
            <td>
                <h4> Please Select the Environment To Copy Selected Server Profile:</h4>
            </td>
        </tr>
        <tr>
            <td>
                @Html.DropDownList(
                    "SelectedEnvironmentID2",
                    new SelectList(
                        Model.EnvironmentViewModel.Select(x => new { Value = x.Id, Text = 
                     x.Name }),
                        "Value",
                        "Text"), new { }
                    )
            </td>
        </tr>
        <tr>
            <td>
                <h4> Please Select the Version To Copy Selected Server Profile:</h4>
            </td>
        </tr>
        <tr>
            <td>
                @Html.DropDownList(
                    "SelectedVersionID2",
                    new SelectList(
                        Model.VersionsModel.Select(x => new { Value = x.Id, Text = x.Number }),
                        "Value",
                        "Text"), new { }
                    )
            </td>
        </tr>
        <tr>
            <td>
                <h4> Please Select the PlatformProfile To Copy:</h4>
            </td>
        </tr>

        <tr>
            <td>
                @Html.DropDownList(
                    "SelectedProfileID2", selectList: new SelectList(
                        Model.PlatformProfilewModel.Select(x => new { Value = x.Id, Text = 
              x.Name }),
                        "Value",
                        "Text"), htmlAttributes: new { }
                    )
            </td>
        </tr>
        <tr>
            <td></td>
        </tr>
        <tr>
            <td>  <input id="copyData" name="SnapshotData" type="submit" value="Submit" /> </td>
        </tr>
        <tr>
            <td></td>
        </tr>
    </table>
  </div>
<script type="text/javascript">
    $(function() {
         @grid1.GetJavaScript();
         @grid2.GetJavaScript();

        $("#getData").click(function() {

            alert("Test");
            document.getElementById('gridWrapper1').style.display = 'block';
            document.getElementById('gridWrapper2').style.display = 'block';
            document.getElementById('gridheader').style.display = 'block';
            $('#gridheader').empty();
            //var content = "<table><tr><td><h4>Selected Environment :" +    
              $('#SelectedEnvironmentID :selected').text() + " </h4></td>" +
            //"<td><h4> Selected Version: " + $('#SelectedVersionID :selected').text() 
            + "</h4></td></tr></table>";
            //$('#gridheader').append(content);

            var url = '@Url.Action("GetServersWithSettings")';
            url = url + '?envtid=' + $("#SelectedEnvironmentID").val() + '&versionid=' + 
         $("#SelectedVersionID").val();
            $("#ServersWS").jqGrid('setGridParam', { url: url }).trigger('reloadGrid');
            alert(url);

            var url1 = '@Url.Action("GetServersWithZeroSettings")';
            url1 = url1 + '?envtid=' + $("#SelectedEnvironmentID").val() + '&versionid=' + $("#SelectedVersionID").val();
            $("#ServersWNS").jqGrid('setGridParam', { url: url1 }).trigger('reloadGrid');

            alert(url1);

        });

        $("#copyData").click(function() {

            var selectedRowId = $('#ServersWS').jqGrid('getGridParam', 'selrow');
            var rowData = jQuery("#ServersWS").jqGrid('getRowData', selectedRowId);

            $("#MainDiv *").attr("disabled", false).off('click');
            var url = '@Url.Action("Index")';
            //url = url + '?envtid=' + $("#SelectedEnvironmentID").val() + '&versionid=' + $("#SelectedVersionID").val()
            //              + '&profileid=' + rowData['ProfileId'] + '&envtid2=' + $("#SelectedEnvironmentID2").val() + '&versionid2=' + $("#SelectedVersionID2").val();
            HideElements();
            $.ajax({
                url: url,
                data: {
                            BaseEnvtId: $("#SelectedEnvironmentID").val(),
                            BaseVersionId: $("#SelectedVersionID").val(),
                            BaseProfileId: rowData['ProfileId'],
                            NewEnvtId: $("#SelectedEnvironmentID2").val(),
                            NewVersionId: $("#SelectedVersionID2").val(),
                            NewProfileId: $("#SelectedProfileID2").val(),
                },
                type: 'POST',
                datatype: 'json',
                success: function(data) {
                    //var content = "<div style=/""color: green ;font-weight:900;/"">Baseline Profile Copied Successfully</div>";
                    $("#MainDiv *").attr("disabled", true).off('click');
                    document.getElementById('ProfileCopyDiv').style.display = 'block';
                    $("#MainDiv *").attr("disabled", false).off('click');
                    document.getElementById('displaySuccess').style.display = 'block';
                    $("#ProfileCopyDiv *").attr("disabled", true).off('click');
                    document.getElementById('ProfileCopyDiv').style.display = 'none';
                },
                error: function() { alert('something bad happened'); }
            });



        });

    });
</script>
4

2 回答 2

2

如果您在 copydata 按钮单击后看到下面的 getdata 按钮单击不会触发。

那是因为您正在为所有属于#MainDiv. 所以这种行为很自然。

     $("#copyData").click(function() {

        var selectedRowId = $('#ServersWS').jqGrid('getGridParam', 'selrow');
        var rowData = jQuery("#ServersWS").jqGrid('getRowData', selectedRowId);

        $("#MainDiv *").attr("disabled", false).off('click'); //<---- HERE
        var url = '@Url.Action("Index")';

因为off关闭事件,在这里你不幸的按钮将被选择#MainDiv *器选择为关闭点击事件。

也更好地使用prop而不是attr

于 2013-10-14T00:41:39.457 回答
0

你可能有一些糟糕的 javascript 在那里抛出一个错误,如果没有看到所有这些,就不可能说出来。尝试在调试器中单步执行(使用 Chrome 的开发人员工具),看看是否收到错误消息。也许是HideElements()函数。

于 2013-10-14T00:37:01.987 回答