After fully loaded the HTML DOM I am calling ajax on form submit and the result I got is: &lt;a data-nonce=&quot;https://hypley.com?wp_nonce=2db70bc9fb&quot; id=&quot;resend_email&quot;&gt;here&lt;/a&gt;&lt;/strong&gt;  Now, again I want to call ajax on that link click: $(&quot;#resend_email&quot;).on(&quot;click&quot;, function (e) {     e.preventDefault();     alert(1);     var user_login = $(&quot;#user_login&quot;).val();     console.log( user_login ); });  But it's not working, I mean at least not showing me the alert. Do you know why, how can I solve it?
112
I have a bit of code where I am looping through all the select boxes on a page and binding a .hover event to them to do a bit of twiddling with their width on mouse on/off.  This happens on page ready and works just fine.  The problem I have is that any select boxes I add via Ajax or DOM after the initial loop won't have the event bound.  I have found this plugin (), but before I add another 5k to my pages with a plugin, I want to see if anyone knows a way to do this, either with jQuery directly or by another option.
92703
I love admin-ajax.php. But I hate having to localize in order to point frontend scripts to it, and I wish there was an equivalent, easy-to-find file for themes. (It also just bothers me to see frontend requests go through "/wp-admin/". No practical reason, just looks ugly IMO.)  So I've simply copied admin-ajax.php to the root dir at "/ajax.php", adjusted the include paths and removed the WP_ADMIN constant definition. Seems to work like gangbusters (I can now just direct all my frontend AJAX requests to /ajax.php! And I can still use the normal wp_ajax hooks in my plugins!).  But is this safe? What might go wrong? Since this isn't built into core, I assume there's a good reason as to why not. But looking through the code, I can't see any immediate problems.   You're smart--tell me if this approach is crazy. Or if there's a simpler method that I'm overlooking.
7478
I would like to upload a file asynchronously with jQuery.     $(document).ready(function () {     $("#uploadbutton").click(function () {         var filename = $("#file").val();          $.ajax({             type: "POST",             url: "addFile.do",             enctype: 'multipart/form-data',             data: {                 file: filename             },             success: function () {                 alert("Data Uploaded: ");             }         });     }); }); &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js"&gt;&lt;/script&gt; &lt;span&gt;File&lt;/span&gt; &lt;input type="file" id="file" name="file" size="10"/&gt; &lt;input id="uploadbutton" type="button" value="Upload"/&gt;     Instead of the file being uploaded, I am only getting the filename. What can I do to fix this problem?
9012
I'd like to make a click event fire on an &lt;input type="file"&gt; tag programmatically.  Just calling click() doesn't seem to do anything or at least it doesn't pop up a file selection dialog.  I've been experimenting with capturing events using listeners and redirecting the event, but I haven't been able to get that to actually perform the event like someone clicked on it.
104313
I really want to run a simple code in my template file.  E.g. if I put somethign like this in my page.php:  &lt;script type="text/javascript"&gt;     jQuery(document).ready(function($) {         alert("Hello world!");     }); &lt;/script&gt;   It's not working.  But simple javascript is working:  &lt;script type="text/javascript"&gt;         alert("Hello world!"); &lt;/script&gt;   Why is jQuery blocked in WP to be included in template files?  and maybe more important question     WHERE IN THE WP SETTINGS CAN I RE-ENABLE THIS?   I know I can use wp_register_script etc. but in my scenario I need to paste simple javascript code in the template files.  How to allow load jQuery code snippets in WP template's file too?  And why is it even blocked?
55857
Sorry if it's been asked. I've already found several solutions that aren't working. Not sure what I'm doing wrong.   I don't want to disable all javascript, only Javascript alert boxes. The ones that pop up and force you to click OK or X to close them.  I've found user scripts that claim to do this (example:  ). I've put chrome on the dev channel, start chrome with the --enable-user-scripts switch, the script shows up as installed.  But I still get the alert boxes.  An example alert box that isn't getting disabled is at  - put in any garbage word into the word validator on the right sidebar. You get a popup telling you it's not a word.
39810
In Prototype I can show a "loading..." image with this code:  var myAjax = new Ajax.Request( url, {method: 'get', parameters: pars,  onLoading: showLoad, onComplete: showResponse} );  function showLoad () {     ... }   In jQuery, I can load a server page into an element with this:  $('#message').load('index.php?pg=ajaxFlashcard');   but how do I attach a loading spinner to this command as I did in Prototype?
104708
I'm working on a web page where I'm making an AJAX call that returns a chunk of HTML like:   &lt;div&gt;   &lt;!-- some html --&gt;   &lt;script type="text/javascript"&gt;     /** some javascript */   &lt;/script&gt; &lt;/div&gt;   I'm inserting the whole thing into the DOM, but the JavaScript isn't being run.  Is there a way to run it?    Some details: I can't control what's in the script block (so I can't change it to a function that could be called), I just need the whole block to be executed.  I can't call eval on the response because the JavaScript is within a larger block of HTML.  I could do some kind of regex to separate out the JavaScript and then call eval on it, but that's pretty yucky.  Anyone know a better way?
10734
I'm using jQuery to wire up some mouseover effects on elements that are inside an UpdatePanel. The events are bound in $(document).ready . For example:  $(function() {         $('div._Foo').bind("mouseover", function(e) {         // Do something exciting     });     });   Of course, this works fine the first time the page is loaded, but when the UpdatePanel does a partial page update, it's not run and the mouseover effects don't work any more inside the UpdatePanel.   What's the recommended approach for wiring stuff up in jQuery not only on the first page load, but every time an UpdatePanel fires a partial page update? Should I be using the ASP.NET ajax lifecycle instead of $(document).ready?
37250
I have create a form with form_validate and form_submit functions.  Using Firefox, everything is OK so the problem is not about an error in functions names.  Using Chrome, when I click on submit the page is just reloaded. I have added to my code drupal_debug to track the process into validate function and submit function. System not going into these functions.  I have no ideas about how form_validate function could be linked with choice of browser.  UPDATE : I have found more details about the cause of the problem :  To submit the form, user not click on the submit button directly. He have to click on an other button which launch js function.  At the end of the js function, I use jQuery( "#edit-continue" ).trigger( 'click' ) to simulate click on the real submit button.  I have tried to click directly on the real submit button and it is working but with trigger I see the ajax GIF of drupal but there is no passage to my form_validate function.  So, I really need to know how drupal can make the difference between a real click and an emulated one. And the most important how can I do to fix or skirt this problem.
30534
I am having a form page called Test Form with this form :  &lt;div id="container"&gt; &lt;form action="wp-content/themes/max-magazine/TestForm.php" method="post" name="myForm"&gt; User &lt;input type="text"  name="uname" /&gt; Email  &lt;input id="email" type="text" name="uemail" /&gt; Password  &lt;input type="password"  name="upass" /&gt; &lt;input type="submit" value="Submit" /&gt;&lt;/form&gt; &lt;/div&gt;   And in backend am having a php file named TestForm.php  &lt;?php  function create_account(){ $user = 'AccountID'; $pass = 'AccountPassword'; $email = 'email@domain.com'; if ( !username_exists( $user )  &amp;&amp; !email_exists( $email ) ) {     $user_id = wp_create_user( $user, $pass, $email );     $user = new WP_User( $user_id );     $user-&gt;set_role( 'contributor' ); }  } add_action('init','create_account'); ?&gt;   Now if this function is defined in function.php then it works fine and create the user but same function in TestForm.php does not work. Please help  Also I will be fetching data from form like this :  &lt;?php $user = $_POST['uname']; $pass = $_POST['upass']; $email = $_POST['uemail']; ?&gt;
17026
I have a JavaScript widget which provides standard extension points. One of them is the beforecreate function. It should return false to prevent an item from being created.   I've added an Ajax call into this function using jQuery:  beforecreate: function (node, targetNode, type, to) {   jQuery.get('http://example.com/catalog/create/' + targetNode.id + '?name=' + encode(to.inp[0].value),    function (result) {     if (result.isOk == false)          alert(result.message);   }); }   But I want to prevent my widget from creating the item, so I should return false in the mother-function, not in the callback. Is there a way to perform a synchronous AJAX request using jQuery or any other in-browser API?
25453
I have created a 'control' using jQuery and used jQuery.extend to assist in making it as OO as possible.  During the initialisation of my control I wire up various click events like so  jQuery('#available input',              this.controlDiv).bind('click', this, this.availableCategoryClick);   Notice that I am pasing 'this' as the data argument in the bind method. I do this so that I can get at data attached to the control instance rather from the element that fires the click event.   This works perfectly, however i suspect there is a better way  Having used Prototype in the past, I remember a bind syntax that allowed you to control what the value of 'this' was in the event.  What is the jQuery way?
119247
I got a set of meta boxes on a custom post type. Two of them are simple input/text-type fields, that should have autocompleted input:   A) Another Custom Post Type B) Users   Now I have the problem that I need to somehow trigger the autocomplete event. So far I have this pretty simple definition:  jQuery( document ).ready( function ($)         {             $( '#some_id' ).autocomplete(             {                  minLength: 2                 ,source:    "&lt;?php print 'SOME_STRING'; ?&gt;"             } );         } );   which gives me the following answer in the console, when I enter "zz":      GET http:// localhost/wordpress/wp-admin/SOME_STRING?term=zz 404 (Not Found)   Point is that I need to run a query (as you can see above) and need to root the request for the source option/argument from autocomplete somehow to a php callback.  I hope someone can explain me how I'd get around this. Thanks (and merry christmas in case you read this :) !
74715
I have several input and option elements on my page, each (well almost) have an event attached to update some text on the page once they change. I use jQuery which is really really cool :)   I also use Microsofts  framework, utilizing the UpdatePanel. The reason why I do that is that certain elements are created on the page based on some server-side logic. I don't really want to explain why I use the UpdatePanel - even if it could (it can with quite some effort) be rewritten to use only  I still want that UpdatePanel.  You probably guessed it - once I have a postback on the UpdatePanel the jQuery events stops working. I actually was expecting this, since the "postback" is not really a new postback so my code in document.ready that binds the events won't be fired again. I also confirmed my suspicion by reading up on it in the jQuery help libraries.  Anyway I'm left with the problem of rebinding my controls after the UpdatePanel is done updating the . I preferably need a solution that does not require adding more .js files (jQuery plug-ins) to the page but something as simple as being able to catch the UpdatePanel's 'afterupdating' where I can just call my method to rebind all the form elements.
91212
I am trying to create a form that will allow users to update their information on the front end.  I am just starting to learn PHP (I know C# very well).  If I use this code to create a form on a WordPress page, how do I get the information from the user when they press the 'Update' button and then update the database?  function Insert_AccountTable_1() {     $current_user = wp_get_current_user();      if ($current_user-&gt;ID != 0)     {         return &lt;&lt;&lt;HTML             &lt;form class="AlumniForm" method="post"&gt;             &lt;h3&gt;Name&lt;/h3&gt;             &lt;br&gt;             &lt;table&gt;                 &lt;tbody&gt;                     &lt;tr&gt;                         &lt;th&gt;&lt;label for="Username"&gt;Username&lt;/label&gt;&lt;/th&gt;                         &lt;td&gt;&lt;span&gt;$current_user-&gt;user_login&lt;/span&gt;&lt;/td&gt;                         &lt;td&gt;&lt;span class="description"&gt;Usernames cannot be changed.&lt;/span&gt;&lt;/td&gt;                     &lt;/tr&gt;                     &lt;tr&gt;                         &lt;th&gt;&lt;label for="current_user_firstname"&gt;First Name&lt;/label&gt;&lt;/th&gt;                         &lt;td&gt;&lt;input id="current_user_firstname" type="text" name="current_user_firstname" value="$current_user-&gt;user_firstname"/&gt;&lt;/td&gt;                     &lt;/tr&gt;                     &lt;tr&gt;                         &lt;th&gt;&lt;label for="current_user_lastname"&gt;Last Name&lt;/label&gt;&lt;/th&gt;                         &lt;td&gt;&lt;input id="current_user_lastname" name="current_user_lastname" type="text" value="$current_user-&gt;user_lastname"/&gt;&lt;/td&gt;                     &lt;/tr&gt;                     &lt;tr&gt;                         &lt;th&gt;&lt;label for="current_user_displayname"&gt;Display Name&lt;span class="description"&gt;(required)&lt;/span&gt;&lt;/label&gt;&lt;/th&gt;                         &lt;td&gt;&lt;input id="current_user_displayname" type="text" value="$current_user-&gt;display_name"/&gt;&lt;/td&gt;                     &lt;/tr&gt;                 &lt;/tbody&gt;             &lt;/table&gt;              &lt;h3&gt;Contact Info&lt;/h3&gt;             &lt;br&gt;             &lt;table&gt;                 &lt;tbody&gt;                     &lt;tr&gt;                         &lt;th&gt;&lt;label for="current_user_email"&gt;E-mail&lt;span class="description"&gt;(Required)&lt;/span&gt;&lt;/label&gt;&lt;/th&gt;                         &lt;td&gt;&lt;input id="current_user_email" type="text" value="$current_user-&gt;user_email"/&gt;&lt;/td&gt;                     &lt;/tr&gt;                     &lt;tr&gt;                         &lt;th&gt;&lt;label for="current_user_url"&gt;Website&lt;/label&gt;&lt;/th&gt;                         &lt;td&gt;&lt;input id="current_user_email" type="text" value="$current_user-&gt;user_url"/&gt;&lt;/td&gt;                     &lt;/tr&gt;                 &lt;/tbody&gt;             &lt;/table&gt;             &lt;input type="submit" name="current_user_submitupdates"&gt;Update&lt;/input&gt;             &lt;/form&gt; HTML;     }     else     {         return &lt;&lt;&lt;HTML         &lt;h3&gt;Error - User not logged in&lt;/h3&gt; HTML;     } }  add_shortcode('InsertAccountTableI', 'Insert_AccountTable_1');
54022
I'm attempting to do an AJAX call (via JQuery) that will initiate a fairly long process. I'd like the script to simply send a response indicating that the process has started, but JQuery won't return the response until the PHP script is done running.  I've tried this with a "close" header (below), and also with output buffering; neither seems to work. Any guesses? or is this something I need to do in JQuery?  &lt;?php  echo( "We'll email you as soon as this is done." );  header( "Connection: Close" );  // do some stuff that will take a while  mail( 'dude@thatplace.com', "okay I'm done", 'Yup, all done.' );  ?&gt;