www.webdeveloper.com
Results 1 to 8 of 8

Thread: Can't find the AJAX - JQuery conflict

  1. #1
    Join Date
    Jul 2009
    Posts
    40

    Can't find the AJAX - JQuery conflict

    I'm tearing my hair out trying to figure out what's causing a conflict in my code ... everything works perfectly in Firefox, but, as usual, IE is totally busted. I've been trying to spot it for weeks and I JUST. CAN'T. FIND. IT.

    Can someone lend a helping hand? FYI, the complete page is here:

    http://mysarasotashortsale.com/test/

    Code:
    <div class="sos_wrap">
      <div id="sos_form">
        <div id="sos_form_div1">
          <h3 style="text-align:right; margin-right:20px">STEP ONE</h3>
          <div class="sos_button" id="sos_div1_button">
            <h4>GO TO STEP 2 &raquo;</h4>
          </div>
          <table width="690px">
        [ ... lots of boring stuff :) ]
                </table></td>
            </tr>
          </table>
        </div>
        <div id="sos_form_div2">
          <h3 style="text-align:right; margin-right:20px">STEP TWO</h3>
          <div class="sos_button" onClick="javascript:jQuery(this).submit();">
            <h4>SUBMIT</h4>
          </div>
          <table width="690px">
      [ ... lots of boring stuff :) ]
          </table>
        </div>
      </div>
    </div>
    <script>
    function notEmpty(elem, helperMsg){
    	if(elem.value.length == 0){
    		alert(helperMsg);
    		elem.focus(); // set the focus to this input
    		return false;
    	}
    	return true;
    }
    </script>
    <script>
    jQuery("#sos_div1_button").click(function(){
    if(notEmpty(document.getElementById('PropertyAddress'),'Address is a required field.')){
    if(notEmpty(document.getElementById('PropertyCity'),'City is a required field.')){
    if(notEmpty(document.getElementById('PropertyState'),'State is a required field.')){
    if(notEmpty(document.getElementById('PropertyZip'),'ZIP code is required.')){
    		jQuery("#sos_form_div1,#sos_form_div2").animate({left:"-=100%"}, "slow");
    		}}}}});
    </script>

  2. #2
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,672
    Opera error console:

    Code:
    [15.03.1970 17:51:48] JavaScript - http://mysarasotashortsale.com/wp-content/themes/einat/js/image_hover.js
    Linked script compilation
    Syntax error at line 1 while loading: expected expression, got '<'
    <script type="text/j
    ^
    [29.01.1970 5:34:24] JavaScript - http://mysarasotashortsale.com/test/
    Inline script thread
    Uncaught exception: TypeError: '$(document).ready' is not a function
    Error thrown at line 80, column 0 in http://mysarasotashortsale.com/wp-content/themes/einat/js/contact.js:
        $(document).ready(function(){
    [20.03.1970 7:05:15] JavaScript - http://mysarasotashortsale.com/test/
    Inline script thread
    Uncaught exception: TypeError: '$(document).ready' is not a function
    Error thrown at line 2, column 1 in http://mysarasotashortsale.com/test/:
        $(document).ready(function(){	
    [02.04.2012 17:09:00] JavaScript - http://mysarasotashortsale.com/test/
    Inline script thread
    Uncaught exception: ReferenceError: Undefined variable: ajaxurl
    Error thrown at line 1, column 102 in <anonymous function>(b) in http://mysarasotashortsale.com/wp-includes/js/wp-lists.js?ver=20110521:
        c={settings:{...
    called from line 1, column 0 in http://mysarasotashortsale.com/wp-includes/js/wp-lists.js?ver=20110521:
        (function(b){var a=...

  3. #3
    Join Date
    Jul 2009
    Posts
    40
    I wish I knew what that meant ... so I'm having trouble in Opera as well, yes? JavaScript just frustrates the hell out of me.

  4. #4
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,672
    for the very first sight your page has more than one $(document).ready(); functions i don't think this is correct. the code itself swarms with various scripts inline and linked and i believe nobody here will puzzle it out.

  5. #5
    Join Date
    Apr 2010
    Location
    Salem,Ma
    Posts
    623
    Quote Originally Posted by Padonak View Post
    for the very first sight your page has more than one $(document).ready(); functions i don't think this is correct. the code itself swarms with various scripts inline and linked and i believe nobody here will puzzle it out.
    incorrect. you can have as many document.ready blocks as you want. it was writtent with such usage in mind.

    that being said, you've got yourself a library conflict. you've got jquery and scriptolicious on the same page but it doesnt appear you are implementing no conflict correctly.

    jquery isnt loading properly becuase of the conflict so all your jquery code is getting broken ( you need to install firebug or similar and start using it to prevent yourself some hair loss from stress )

    http://docs.jquery.com/Using_jQuery_...ther_Libraries

    - also side note, youve got 30+ wc3 validation issues in the page.

  6. #6
    Join Date
    Jul 2009
    Posts
    40
    Thanks, Dan - I do have Firebug installed, but I've never quite figured it out. That said, it all works in Firefox

    I'm looking at IE's developer tools and it's throwing these errors when I try to submit the form (I don't get any errors with Firebug):

    SCRIPT16389: Failed
    jquery.min.js?ver=3.3.1, line 56 character 155
    SCRIPT16389: Failed
    jquery.min.js?ver=3.3.1, line 56 character 155
    SCRIPT16389: Failed
    jquery.min.js?ver=3.3.1, line 79 character 316
    SCRIPT16389: Failed
    jquery.min.js?ver=3.3.1, line 56 character 155
    SCRIPT16389: Failed
    jquery.min.js?ver=3.3.1, line 56 character 155

  7. #7
    Join Date
    Apr 2010
    Location
    Salem,Ma
    Posts
    623
    you are using firebug but you didnt see any of this? :


    syntax error
    [Break On This Error]

    if (navigator.userAgent.match(/Opera (\S+)/)) {

    image_hover.js (line 15, col 1)

    $(document).ready is not a function
    [Break On This Error]

    $(document).ready(function(){

    contact.js (line 80)
    $(document).ready is not a function
    [Break On This Error]

    $(document).ready(function(){

    /test/ (line 616)
    ajaxurl is not defined
    [Break On This Error]

    ...else{n.dimAddColor=n.dimAddColor||"#FFFF33"}if(m[5]){n.dimDelColor="#"+m[5]}else...

    wp-lis...0110521 (line 1)
    "NetworkError: 404 Not Found - http://mysarasotashortsale.com/wp-content/themes/einat/images/bg-meta-700.png"
    bg-meta-700.png
    $ is not a function
    [Break On This Error]

    element = $(element);

  8. #8
    Join Date
    Jul 2009
    Posts
    40
    let me take that back - I don't see any errors that are new. This site is done through Wordpress and there have always been little conflicts.

    Everything on the site was working until I added the basic form in the middle of the page, which uses WP's packaged jQuery just to slide the tab over; from there, the form doesn't submit (in fact, it does nothing but throw errors). It's quite frustrating.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles