Bootstrap modal popup not working properly in aspx-Collection of common programming errors

i have this button B1 (say) when i click on this B1 a modal popup appears with buttons / links

when i click the button / link a new popup should appear but i dont get the Modal window but i do get the values in firebug

Here is the code to the Button B1

 

which then calls this modal popup which contains the content from the div divB1Market



    
        
        ×
        

Heading

          
        
        
        
        
        Done
        
    

The code below is the link / content inside the divB1Market

Link here

which inturn calls the ajax call

PlayerMP.getFunctionDetails = function (type, UserID, SessionID, SessionNo) {
$.ajax({
    type: "GET",
    url: PlayerMP.URL,
    data: "rt=4&type=" + type + "&UserID=" + UserID + "&SessionID=" + SessionID + "&SessionNo=" + SessionNo,
    success: function (FinancialSplitsJS) {
        if (FunctionalSplitsJS.indexOf("SessionExpired=1", 0) == -1) {

            $("#divFunctionalDetails").html(FunctionalSplitsJS);
            switch (type) {
                case 1:
                    $("#divFunctionalsSplit"); 
                    break;
                            }                

                    $("#divFunctionalsSplit").show();        /* calling the div with this id in the aspx page */
        }
        else
            window.location.href = "../Login.aspx?SessionExpired=1";
    }
});}

This is the modal-popup content in the aspx page

  
        
            
                  
                        

Content

      
                   
                  
                    
                   
            
        
    

This is what i get when i openup firebug and hover around with my cursor

But when i try to debug the code with firebug i get the responses (in the console) perfectly. I'm not able to figure out where the error might be.

This is the order of my importing the packages (posted this because i got this error while using )

$("#divFunctionalsSplit").modal().show();

Uncaught TypeError: Object # has no method 'modal'





  1. All I needed to add was jQuery.noConflict(); before $('#divID').modal('show') it had to something to do with with other plugins conflicting.

  2. It would appear that the id of your modal is getting overwritten by ASP. It changes from #B1Market to #divFunctionalSplit. I assume your button still has an href of #B1Market. Simple solution would be to change the href to match the div id. Better solution would be to prevent ASP from replacing the id.

Originally posted 2013-11-15 02:45:53.