We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
MODX Community Forums Archive

Ajax in Manager Module

    • 1944
    • 12 Posts
    apprentice Reply #1, 13 years, 10 months ago
    Guys i’m having a module that uses tabs and gets pages dynamically by requesting them with .load(). However when i have forms on this pages none of them works. I tried everything in jQuery that can hook form (.submit etc. etc.), onclick event. Nothing works. Is there a problem with multiple frames and AJAX?

    btw im calling the script in the main page with the tabs.
      • 15001
      • 697 Posts
      Jul Reply #2, 13 years, 10 months ago
      Did you try using Firebug, activate the "Script" debugging with all options and reload the page?

      Look in the Firebug "Console" tab what happens with your Ajax requests.
      Do some of them fail?

      Often the Firebug option "Stop to each error" is too strict. In general, I disable it. It is sometimes useful to locate errors, but it can also detect problems at another location where they really are.
        • 1944
        • 12 Posts
        apprentice Reply #3, 13 years, 10 months ago
        Thats the problem they are not created at all. For example:

        	jQuery(document).ready(function(){ 
		jQuery('form').submit(function(){
			var dataString = jQuery(this).serialize();

			jQuery.ajax({
				async: true,
				cache: false,
				type: 'POST',
				url: 'index.php?a=112&id=2',
				data: dataString,
				success: function() {
					alert('Transmitted');
				}
			});
	  });
	});


        and my form declaration:

        <form id="submitForm" method="POST" onsubmit='return false;'>


        But it doesn’t seems to work. Clicking the submit button does nothing (i mean obviously because of "return false", but there is no connection created from jquery either when there should be. Add event to the submit button doesn’t work also.
          • 15001
          • 697 Posts
          Jul Reply #4, 13 years, 10 months ago

          The "action" attribute is required for form elements.
          See the W3C specification: http://www.w3.org/TR/REC-html40/interact/forms.html#edef-FORM

          Your jQuery code in itself seems correct, but make sure that the selector works.
          Maybe use the form id for the jQuery selector, to be sure that the selection is not a set of elements but the form itself.

          The "onsubmit" event handler is optional. I assume you use it to prevent the "action".
          Try removing the "onsubmit" event handler as you already manage this with jQuery.

          Try this*:
          action="javascript:return false;"

          or 
          action="#"

          or
          action="document.location=this.location"


          *Not verified, just a few ideas

          Hope this helps. It’s late here and I probably won’t answer tonight anymore.
            • 1944
            • 12 Posts
            apprentice Reply #5, 13 years, 10 months ago
            Thanks but the action isn’t a problem, i tried with it however still doesn’t work.
            • sottwell Reply #6, 13 years, 10 months ago
              Is the jquery library actually getting loaded in the frame?
                Studying MODX in the desert - http://sottwell.com
                Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
                Join the Slack Community - http://modx.org
                • 1944
                • 12 Posts
                apprentice Reply #7, 13 years, 10 months ago
                Quote from: sottwell at Jul 03, 2010, 07:05 AM

                Is the jquery library actually getting loaded in the frame?

                Yes it turned out that the event wasn’t working because of my stupid mistake, i didn’t correctly pointed the hierarchy of the classes. Anyway thanks for the answers.