Take the 2-minute tour ×
SharePoint Stack Exchange is a question and answer site for SharePoint enthusiasts. It's 100% free, no registration required.

I am working on SP2010 with visual web part in C#. I have added one form dialog using jquery-ui. When I use it directly from .ascx, its working. But when I am calling it from code behind, its not showing up. It seems jquery ready function itself is not able to initialize.

This is my javascript code to generate popup:

$(document).ready(function () {

alert('readying function');
//setup new comments dialog
$('#newComment').dialog({
    autoOpen: false,
    draggable: true,
    title: "Add New Comment",
    open: function (type, data) {
        $(this).parent().appendTo("form");
    }
});

});

function showDialog(id) {
    alert('Showing ' + id);
    $('#' + id).dialog("open");
    alert('did you see ' + id);
}

The popup before making dialog ready is coming up. But then dialog is not showing. I have ensured my script and jquery-us.css is embedded on top of the page. I am using jquery 1.9.1.

Am I making any mistake here? Such a simple thing is eating lot of time :(

share|improve this question
    
are you getting any javascript errors? If so, what? –  Dave Wise Mar 29 '13 at 15:40
    
No Dave. There is no error. When .js file was included using normal <script include>, I was getting it, but then after I used SharePoint:ScriptLink with defer=false, I am not getting any javascript error on console. –  Manoj Patil Mar 29 '13 at 16:41
    
can you add a debugger; in the open function and see if it makes it that far? Also can you add the code that is opening the dialog? –  Ryan Erickson Mar 29 '13 at 18:19
    
Its not going into jquery at all. Updated the post with this show dialog code. Interestingly both alerts are coming up but dialog is not! –  Manoj Patil Mar 29 '13 at 19:19
add comment

1 Answer

Are you certain that the element you are selecting actually exists? I noticed that the dialog you are creating and the one you are calling open on in your functions above are not the same. If you look at this fiddle, I get the exact same symptoms as you are having because the selector I am using does not exist.

http://jsfiddle.net/RobertKaucher/teG5f/

<input type="button" value="open" id="open-button" />

<div class="hidden" id="dialog">
    Hello, world!
</div>


$( "#dialog" ).dialog({
      autoOpen: false,
      height: 300,
      width: 350,
      modal: true
});

$("#open-button").click( function(){ 
    console.log("click");
    $("#dialogbad").dialog("open"); 
    console.log("click 2");

});
share|improve this answer
    
Thanks Robert for your response and sharing jsfiddle. Actually indeed that element was not ready. But then even after adding similar ready function for 'new' dialog, its not appearing. The strange thing is its not showing any javascript error as well. –  Manoj Patil Apr 1 '13 at 6:32
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.