Note that there are some explanatory texts on larger screens.

plurals
  1. POjquery function starts before the page is loaded
    primarykey
    data
    text
    <p>I have a php page, wich hase some external links to js files in the head, and on body I have some selectable elements from jquery(sometimes I do not have them, because thouse elements are generated if the user is login). The problem is in the javascript I wrote, I get this error: TypeError: Object [object Object] has no method 'disableSelection'. Even if I put a ".sortable" element in the php, I still get this error. In html looks like it has no problem with that and works fine. The code that gives me the error is this:</p> <p>Sorry for my english. I can put the hole code if you want but is too big. I think the problem is because the javascript is loading too fast or before of the html is generated.( I tried to put a variable in the js and that function under a if() but is not working)</p> <p>The javascipt(scripturi.js):</p> <pre><code> var logat=0; $(document).ready(function() { $( ".sortable0" ).sortable(); $( ".sortable0" ).disableSelection(); $( ".sortableIt" ).disableSelection(); $( ".sortableIt" ).sortable( { stop: function(event, ui) { for(var i=0;i&lt;ui.item.parent().children().length;i++) { var x =ui.item.parent().children()[i].id; //update items din acest sertar //updateItemServer(x,i) //alert(x+ " " + i); } } }); $( ".sortable" ).disableSelection(); $( ".sortable" ).sortable({ stop: function(event, ui) {reparaZindex();}}); }); function updateItemServer(x,i){ //alert(x+" "+i); } function incarca(){ $(document).ready(function (){ $.getJSON("http://students.info.uaic.ro/~calin.chifan/api/compartiment/list.json", function(data){ var html = []; /* loop through array */ $.each(data, function(index, d){ addCompartiment(d.nume_comp,d.id); }); }).error(function(jqXHR, textStatus, errorThrown){ /* assign handler */ alert("error occurred!"); }); }); } function addCompartiment(nume,id){ $("#sortable0").append('&lt;ul class="sortable" id'+ +'&gt;'); } function updateIndexServer(x,y){ //alert(x+" "+y); //trimite id-ul x si pozitia y } function reparaZindex(){ $.each($(".sortable &gt; li"), function() { if($(this).find('.sertar')[0]) { $(this).find('.sertar').eq(0).css('z-index',(500-$(this).index()*2)); updateIndexServer($(this).find('.sertar')[0].id,$(this).index()) } if($(this).find('.sortableIt')[0]) $(this).find('.sortableIt').eq(0).css('z-index',(501-2*$(this).index())); }); } window.onload = function() { //incarca(); //reparaZindex(); } </code></pre> <p>It's strange that in the html I don't have this problem. After the user is logedin I want to call a function that will append some ul (.selectable) elements but so far it can't even notice that there are some elements. If you want I can give you a link to the page I work.</p> <p>A little bit of the php:</p> <pre><code> &lt;?php ini_set('session.save_path', '/tmp/'); session_start(); $logged=0; if(isset($_SESSION['autentificat'])) { if($_SESSION['autentificat']==1) $logged=1; } $user= $_COOKIE['user']; echo' &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;Proiect Web&lt;/title&gt; &lt;meta charset="utf8"&gt; &lt;meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"&gt; &lt;title&gt;jQuery Dropdown Login Freebie | The Finished Box&lt;/title&gt; &lt;link rel="stylesheet" type="text/css" href="main.css"&gt; &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"&gt;&lt;/script&gt; &lt;script src="login.js"&gt;&lt;/script&gt; &lt;script src="scripturi.js"&gt;&lt;/script&gt; &lt;script src="dulap.js"&gt;&lt;/script&gt; &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"&gt;&lt;/script&gt; &lt;script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"&gt;&lt;/script&gt; &lt;script src="login.js"&gt;&lt;/script&gt; &lt;/head&gt;' ; if($logged==1) { echo'&lt;body onload="loadYeslog()"&gt;'; } else { echo'&lt;body onload="loadNoLog()"&gt;'; } echo '&lt;div class="mainbar"&gt; &lt;div id="loginContainer"&gt; &lt;div id="loginButton"&gt;&lt;span style="display:block;width:48px;height:27px; "&gt;Login&lt;/span&gt;&lt;/div&gt; &lt;div id="logoutButton" class="barbutton" style"cursor:pointer;"&gt;&lt;span&gt;Logout&lt;/span&gt;&lt;/div&gt;'; if($logged==0) { echo'&lt;div id="welcomeLabel" class="barbutton"&gt;&lt;span&gt;Not Logged in!&lt;/span&gt;&lt;/div&gt;'; } else { echo '&lt;div id="welcomeLabel" class="barbutton"&gt;&lt;span&gt;Welcome '.$user.' !&lt;/span&gt;&lt;/div&gt;'; } echo '&lt;div style="clear:both"&gt;&lt;/div&gt; &lt;div id="loginBox"&gt; &lt;form id="loginForm" action="autentificare2.php" method="POST"&gt; &lt;fieldset id="body"&gt; &lt;fieldset&gt; &lt;label for="username"&gt; Username&lt;/label&gt; &lt;input type="text" name="user"/&gt; &lt;/fieldset&gt; &lt;fieldset&gt; &lt;label for="password"&gt;Password&lt;/label&gt; &lt;input type="password" name="password"/&gt; &lt;/fieldset&gt; &lt;input type="submit" id="login" value="Sign in" /&gt; &lt;label for="checkbox"&gt;&lt;input type="checkbox" id="checkbox" /&gt;Remember me&lt;/label&gt; &lt;/fieldset&gt; &lt;span&gt;&lt;a href="recovery.php" style="color: white;"&gt;Forgot your password?&lt;/a&gt;&lt;/span&gt; &lt;div id="regbut"&gt;&lt;span&gt;New user ? &lt;/span&gt;&lt;/div&gt; &lt;/form&gt; &lt;/div&gt; &lt;div id="regbox"&gt; &lt;form id="registerform" action="register.php" method="POST"&gt; &lt;table style="margin-top:10px;"&gt; &lt;label for="Dusername"&gt; REGISTAR FOARM!!! &lt;/label&gt; &lt;tr&gt; &lt;td&gt; &lt;label for="Dusername"&gt; Username: &lt;/label&gt; &lt;/td&gt; &lt;td&gt;'; ?&gt; &lt;input type="text" name="Duser" placeholder="Introduceti numele de cont dorit" onblur="javascript:semnaleazaExistaNume (this.value, '')" /&gt; &lt;/td&gt; &lt;td&gt; &lt;span class="ascuns" id="eroareNume"&gt;Numele deja exista, alegeti altul... &lt;/span&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt; &lt;label for="Dpassword"&gt; Password: &lt;/label&gt; &lt;/td&gt; &lt;td&gt; &lt;input type="password" name="Dpassword"/&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt; &lt;label for="Demail"&gt; E-Mail: &lt;/label&gt; &lt;/td&gt; &lt;td&gt; &lt;input type="text" name="Demail"/&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt; &lt;input type="submit" id="register" value="Register" /&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/fieldset&gt; &lt;/table&gt; &lt;/form&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="box"&gt; &lt;ul class="sortable0" id="sortable0"&gt; &lt;ul class="sortable" id="sortableColona1"&gt; &lt;li id="sertar1" style="z-index:10"&gt; &lt;img id="sertar11" class="sertar" ONCLICK="openS(this)" style="position: relative;z-index:500;aligh:center;" src="img/sertar1.png"&gt; &lt;ul id="ui items1" style="z-index:501;position:relative;visibility:hidden;" class="sortableIt" &gt; &lt;li id="item1" class="ui-state-default"&gt;1&lt;/li&gt; &lt;li id="item2" class="ui-state-default"&gt;2&lt;/li&gt; &lt;li id="item3" class="ui-state-default"&gt;3&lt;/li&gt; &lt;li id="item4" class="ui-state-default"&gt;4&lt;/li&gt; &lt;li id="item5" class="ui-state-default"&gt;5&lt;/li&gt; &lt;li id="item6" class="ui-state-default"&gt;6&lt;/li&gt; &lt;li id="item7" class="ui-state-default"&gt;7&lt;/li&gt; &lt;li id="item8" class="ui-state-default"&gt;8&lt;/li&gt; &lt;li id="item9" class="ui-state-default"&gt;9&lt;/li&gt; &lt;li id="item10" class="ui-state-default"&gt;10&lt;/li&gt; &lt;li id="item11" class="ui-state-default"&gt;11&lt;/li&gt; &lt;li id="item12" class="ui-state-default"&gt;12&lt;/li&gt; &lt;/ul&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload