【问题标题】:Jquery UI Modal Dialog Not Working ProperlyJquery UI 模态对话框无法正常工作
【发布时间】:2015-05-07 20:04:00
【问题描述】:

我创建了一个 jQuery 模式密码对话框来重定向到一个页面以进行密码验证。

模态对话框显示正常,但不是执行处理密码验证的方法,而是在浏览器警报对话框上显示错误[object Object]。我试图弄清楚我在这里做错了什么。

下面是我的代码:

JavaScript/jQuery

$(document).on("click", "[id*=lnkView1]", function() {    
    $("#dlgPassword").dialog({
        title: "View Details",
        buttons: {
            Go: function() {
                var valPassword = $("[id*=cpgnPassword]").val();
                var hdfCamId = $('#<%=rptCampaigns.ClientID %>').find('input:hidden[id$="hdfCampaignID"]').val();
                $("[id*=hdfCampaignID2]").val(hdfCamId);
                //var jsonObj = '{password: "' + valPassword + '"}';
                var res;
                $.ajax({
                    type: 'POST',
                    contentType: 'application/json; charset=utf-8',
                    data: '{password: "' + valPassword + '"}',
                    dataType: 'json',
                    url: 'CampaignsList.aspx/ValidatePasswordWM',
                    success: function(data) {
                        alert('successful')
                    },
                    error: function(err) {
                        alert(err.toString());
                    }
                });

                $(this).dialog('close');
            }
        },
        modal: true
    });
    return false;
});

代码隐藏

protected void ValidatePassword(object password)
{
    var campaign = new CampaignsService().GetByCampaignId(hdfCampaignID2.Value);
    if (campaign != null)
    { 
        if (campaign.Password.Equals(password))
            Response.Redirect("CampaignDetails.aspx?CampaignID=" + hdfCampaignID2.Value);
    }            
}

[WebMethod]
public static void ValidatePasswordWM(object password)
{
    CampaignsList page = new CampaignsList();
    page.ValidatePassword(password);
}

谁能帮我找出问题所在?

【问题讨论】:

  • 使用 err.responseText 代替 err.toString()
  • 感谢@Silence。它向我展示了异常和堆栈跟踪。异常消息:Object reference not set to the instance of an object. 并且堆栈跟踪位于 ValidatePassword 方法上。我猜password 参数为空。这是真的吗?
  • 不客气@kacey 还有一件事 response.redirect 不适用于 Web 方法,您可以重定向页面客户端
  • 这就是为什么它不是直接在网络方法上,而是在我在网络方法下调用的单独方法中
  • @KaceyEzerioha 我看到您在另一个答案下的评论中发布了有关逐步执行代码的信息。您可以使用他们的开发者工具在任何浏览器中单步执行您的 JavaScript 代码。在大多数浏览器中,按 F12 将打开内置调试器的开发工具。

标签: c# jquery asp.net jquery-ui webforms


【解决方案1】:

您需要对话框中的appendTo 属性,以便将其正确添加到表单中。

$("#dlgPassword").dialog({
    title: "View Details",
    appendTo: "form",
    buttons: {
    ...

【讨论】:

  • 谢谢梅森。我补充说。但它仍然无法正常工作。
【解决方案2】:

试试err.message,而不是err.toString()

【讨论】:

  • 感谢您的回复,乔尼。我按照指示更改了它。现在我看到Undefined。我希望我可以单步执行代码以了解发生了什么。但我不知道如何通过 jquery。
【解决方案3】:

此代码在 jQuery UI 上显示产品地籍。按下确定按钮后,重新填充下拉列表。

Javascript:

$dialog = $("#dlgCadastroProduto").dialog({
    modal: true,
    autoOpen: false,
    height: 500,
    width: 700,
    buttons: {
        Ok: function () {
            $(this).dialog("close");                
            $("#lstProducts").empty();
            $("#lstSelectedProducts").empty();
            $.ajax({
                type: "GET",
                url: '/Produto/jsonLoad',
                async: true,
                dataType: 'json',
                success:
                    function (data) {
                      //alert('sucesso');
                      $.each(data, function (index, value) {
                          //insere elemento na droplist
                        $("#lstProducts").append('<option value='+value.ID+'>'+value.Descricao+'</option>')                    
                      });
                    },
                error: function (data) {
                     //alert(data);
                }
            });
        }
    }
});

$("#btnCadastroProduto").button().on("click", function () {
    $dialog.dialog("open");
});

控制器的代码隐藏:

    public JsonResult jsonLoad()
    {
        var lista = _produtoBLL.FindAll();
        var xpto = lista.Select(x => new { Id = x.ID, Descricao = x.Descricao });
        return Json(xpto, JsonRequestBehavior.AllowGet);
    }

希望对你有所帮助

【讨论】:

    【解决方案4】:

    这只是您可以使用的示例代码

    客户端

    var mparam = "{param1:'" + mvar1 + "',param_n:'" + mvar_n + "'}";
    $.ajax({
        type: "POST",
        url: "file_name.aspx/web_method",
        data: mparam,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (Response) {
            try {
                var msdata = JSON.parse(Response.d);
                if (msdata.err == "0") {
                    location.replace("newlocation");
                }else{
                    alert("Error:" + msdata.msg);
                }           
            } catch (e) {
                alert("Error in JSON parser error:" + e.description);
            }
        },
        error: function (medata) {
            alert("Internal Server Error:" + medata);
        }
    });
    

    服务器端

    [System.Web.Services.WebMethod]
    public static string web_method(string param1, string param_n)
    {
        string strerror = "0", strmessage = "";
        try
        {
            strerror = "0";
        }
        catch (Exception ex)
        {
            strerror = "2";
            strmessage = ex.Message;
        }
    
        return "{\"err\":\"" + strerror + "\",\"msg\":\"" + strmessage + "\"}";
    }
    

    【讨论】:

    • 在 JavaScript 中使用 try...catch 时要非常小心,因为它不经常使用,并且在不同的引擎中对它的支持有点挑剔。此外,它很慢并且不适用于异步操作。在programmers.se 上有一个关于这个主题的很好的讨论,还有很多文章说你应该在大多数 的情况下避免它。话虽如此,它肯定有用途,但我不相信这是其中之一。
    • 另外,请尝试解释为什么您的代码解决了您的答案中的问题,而不仅仅是提供示例代码。
    猜你喜欢
    • 2014-10-18
    • 2014-01-06
    • 2017-08-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-06-09
    • 2016-03-28
    • 1970-01-01
    相关资源
    最近更新 更多