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

Question

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?

I found a typo in my dialog script - it was missing the '#' in front of the "rangeDialog" selector, so there's no way it could have worked because it couldn't have found my dialog div. However, that didn't change anything, it still doesn't work. — timbck2
– timbck2, Commented Jun 4, 2013 at 19:18

Community · Accepted Answer · 2017-05-23 12:18:53Z

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>

edited May 23, 2017 at 12:18

CommunityBot

11 silver badge

answered Jun 4, 2013 at 20:28

timbck2

1,0763 gold badges15 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Smeegs · Accepted Answer · 2013-06-04 17:54:53Z

0

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);
}

answered Jun 4, 2013 at 17:54

Smeegs

9,2446 gold badges47 silver badges79 bronze badges

5 Comments

timbck2 Over a year ago

Isn't that the same as what I had, just telling ASP.NET to render the "<script>" tags instead of doing it myself? I tried it anyway, with both RegisterClientScriptBlock and RegisterStartupScript, but it made no difference.

Smeegs Over a year ago

Did you check to see where the javascript was being rendered in the generated source? As I mentioned, it has to be rendered after the function definition.

Smeegs Over a year ago

There are a few reasons why it won't fire. The big 2 are 1) It's being called too early and 2) There is a syntax error in the function. To test #2 I would just call the function on $(document)ready(function(){ShowRangeDialog();}); If it doesn't fire when you call it on document ready, then there's something wrong in the actual function. Not the function call

timbck2 Over a year ago

I looked at the generated source, and it definitely gets inserted after my function. And when I put it in $(document).ready(function(){}) the dialog pops right up. So I don't know what else to try from here.

Smeegs Over a year ago

Yeah, that's odd. Try doing a simple alert statement and see if that works.

Collectives™ on Stack Overflow

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

2 Answers 2

Comments

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related