How do I call up a jQuery UI dialog from ASP.NET code behind without a client-side event?

问题

I'm trying to open a jQuery UI dialog from my C# ASP.NET code based on a value being outside a certain range, rather than based on a button click or other client-side event. Here's the Javascript function that should create the dialog (at the top of the .aspx page):

<script type="text/javascript">
  //Total out of range dialog
  function ShowRangeDialog() {
    $('#rangeDialog').dialog({
      modal: true,
      width: 'auto',
      resizable: false,
      draggable: false,
      close: function (event, ui) {
        $('body').find('#rangeDialog').remove();
      },
      buttons:
      {
        'OK': function () {
          $(this).dialog('close');
        }
      }
    });
  }
</script>

Here's the dialog div itself (at the bottom of the .aspx page):

<div id="rangeDialog" style="display: none;" title="Total out of range">
  <p>
    Your line items total is out of the range allowed by the approval level you chose.
    Please check the approval range and adjust the line items or quantities.
  </p>
</div>

And here's the section of the C# code behind that attempts to display the dialog:

if (currTotal < lowerLim || currTotal > upperLim)
{
  //Show jQuery dialog telling user that their line items total is out of range
  Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "dlgOutOfRange",
    "ShowRangeDialog();", true);
}

The code in the if block is being reached and executed if I step through it in the debugger, but the dialog isn't being displayed. What am I missing?

回答1:

I modified my function slightly, based on a question/answer I found at How do I open a jQuery UI Dialog from my c# code behind?, and now it works. Here's the modified function:

<script type="text/javascript">
  //Total out of range dialog
  function ShowRangeDialog() {
    $(function() {
      $('#rangeDialog').dialog({
        modal: true,
        width: 'auto',
        resizable: false,
        draggable: false,
        close: function (event, ui) { $('body').find('#rangeDialog').remove(); },
        buttons: { 'OK': function () { $(this).dialog('close'); }
        }
      })
    }).dialog("open");
  }
</script>

回答2:

try this

if (currTotal < lowerLim || currTotal > upperLim)
{
  //Show jQuery dialog telling user that their line items total is out of range
  Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "dlgOutOfRange",
    "ShowRangeDialog();", true);
}

You should just be calling the function name.

Also, you may want to try startupscript instead of registerclientscriptblock. You have to be sure that your script gets added AFTER the function is defined, and not before.

if (currTotal < lowerLim || currTotal > upperLim)
{
  //Show jQuery dialog telling user that their line items total is out of range
  Page.ClientScript.RegisterStartupScript(this.GetType(), "dlgOutOfRange",
    "ShowRangeDialog();", true);
}

来源：https://stackoverflow.com/questions/16924329/how-do-i-call-up-a-jquery-ui-dialog-from-asp-net-code-behind-without-a-client-si

标签

ASP.NET

jquery-ui-dialog