CODEWITHSUNDEEP
javascriptjqueryjquery-mobilecordova
sanatan mishra
sanatan mishra

Reputation: 81

How to open a Dialogue Box On Page Load

I am trying to open a Dialogue Box On page load of jquery Mobile screen .Right now i am able to open Dialogue Box on button Click .I want the Dialogue box to get pop up automatically on page load but not able to do it. Here is the HTML..

 <body onload="onLoad()">

 <p style="display: none>You have entered: <span id="dialogoutput"></span></p>

 <a href="#" id="dialoglink" data-role="button" style="display: none>Open Dialog</a>

 <!-- Contacts list page -->
 <div data-role="page" id="cont_list_page" data-theme="a">        
 <div data-role="header" data-position="fixed" data-tap-toggle="false">
 </div>
 </div>
 </body>

and Here is my jquery ..

function onLoad() { 
document.addEventListener("deviceready", onDeviceReady, false);
$("#searchby_chooser_ok_button").bind ("click", searchByCriteria); 

if (typeof Contact === "undefined") {
    getElement("contacts_list").innerHTML = "<p>The Cordova Contacts API is inaccessible</p>";
}
}

Please help me to pop up the Dialogue on Page Load not on button click event automatically. Thanks

Upvotes: 0

Views: 1896

Answers (3)

Yashika Garg
Yashika Garg

Reputation: 2366

function onLoad() 
{ 
  openDialogBox();  
  document.addEventListener("deviceready", onDeviceReady, false);
  $("#searchby_chooser_ok_button").bind ("click", searchByCriteria); 

 if (typeof Contact === "undefined") {
    getElement("contacts_list").innerHTML = "<p>The Cordova Contacts API is  inaccessible</p>";
 }
}

function openDialogBox()
{ 
  $("#simplestring").simpledialog({
    'mode' : 'string',
    'prompt' : 'Please Enter Your Mobile No.',
    'buttons' : {
    'OK': {
       click: function () {
         $('#dialogoutput').text($('#dialoglink').attr('data-string'));
       }
     },
     'Cancel': {
       click: function () { },
       icon: "delete",
       theme: "c"
      }
     }
   })
 }

Upvotes: 0

arachnid
arachnid

Reputation: 236

You can fire the click in your jquery code as 

$('#simplestring').click();

Write this statement on page load. It will fire click from inside your code and as the click handler does, it will open the dialog :)

Upvotes: 0

Yashika Garg
Yashika Garg

Reputation: 2366

Try using $(document).ready(function(){})

$(document).ready(function()
{
  $("#simplestring").simpledialog({
    'mode' : 'string',
    'prompt' : 'Please Enter Your Mobile No.',
    'buttons' : {
      'OK': {
        click: function () {
          $('#dialogoutput').text($('#dialoglink').attr('data-string'));

          //get the Value Entered 
          //Create a Sqlite Database and table 
          //Insert it there 

        }
      },
      'Cancel': {
        click: function () { },
        icon: "delete",
        theme: "c"
      }
    }
  })
});

Upvotes: 1

Related Questions