Jump to content

Using Ajax with Wordpress


Nightasy
 Share

Recommended Posts

Greetings all,

 

Been trying to make a plugin in wordpress and ran into an issue with the way wordpress makes use of ajax in the administration menu. The problem is that I completely don't understand it. I've read all the docs on it and even tried messing with a variety of tutorials on the matter to no avail.

 

What I am trying to do is a simple task outside of wordpress. The form has two select fields, the first field populates the second selection field. While this works fine on a standard html page, trying to do it in wordpress is another story.

 

Form.php:

<div id="wrapper">
<h1>Second dropdown selection based </h1>
<form action="" method="post">
<p><label>Main Menu :</label>
<select name="main_menu_id" id="main_menu_id">
<option value="">Select</option>
<?php
// Connect to database.
	$connect = mysqli_connect('<!--DB connection info-->");
$q = mysqli_query($connect, "SELECT cfid,cfname FROM categoryfiles ORDER BY cfid");
while($row = mysqli_fetch_array($q)) {
	echo '<option value="' . $row['cfname'] . '">' . $row['cfname'] . '</option>';
}
?>
</select>
</p>
<p><label>Sub Menu:   </label>
<select name="sub_menu_id" id="sub_menu_id"></select>
</p>
</form>
</div>

The script.js

$(function() {
	$("#main_menu_id").bind("change", function() {
		$.ajax({
			type: "GET",
			url: "scripts/get_sub_category.php",
			data: "main_menu_id="+$("#main_menu_id").val(),
			success: function(html) {
				$("#sub_menu_id").html(html);
			}
		});
	});
});

The get_sub_category.php

<?php

	// Connect to database.
	$connect = mysqli_connect('<!--My connection info-->);
							  
	$id = $_GET['main_menu_id'];
	$q = mysqli_query($connect, "SELECT sfid, sfname FROM subjectfiles WHERE sfcategory='" . $id . "' ORDER BY sfname");
	while($row = mysqli_fetch_array($q)) {
		
	echo '<option value="' . $row['sfname'] . '">' . $row['sfname'] . '</option>';
	
	}
?>

Like I said, it works just fine outside of wordpress so really I just need help getting it to work in wordpress. I just don't understand it. Thanks to anyone that takes the time to look this over.

 

Best Regards,

Nightasy

Link to comment
Share on other sites

.bind() has been deprecated as of JQuery 1.7, with .on() being the preferred method of binding events to potentially non-existing dom objects at page load. That may have something to do with it - check which version of JQuery is being used in each case. Also, I've run across a couple odd occurrences where using the dom element selector doesn't actually work, and it needed to be something along the lines of

$(document).on('click','#main_menu_id',function(){
    ...
});

Don't quote me on the actual syntax above - I've only run across the situation once or twice, so I can't pull it out of my brain right now. I'll look tomorrow morning and see if I can find a concrete example.

Link to comment
Share on other sites

@maxxd - Thanks for catching that deprecation. I completely missed it and the .on() is really identical in functionality so all I had to do with change that one command. It didn't solve the issue I was having here though. The issue revolves around how Wordpress makes use of Ajax on the backend. In the wordpress documentation on it they try to make it sound like they way they handled the use of Ajax is the "greatest most easiest thing evar!!!" when in reality they just made it ten times more complex to do. From my readings it had to do with security issues they ran into quite awhile back.

 

Either way though, it doesn't matter anymore. My team has decided to make the menu external from wordpress anyhow for added security measures since it controls our entire entry database. No sense in taking any risks with wordpress (which has been known to have been hacked) when we know that we can lock it up like fort knox using an external platform if you know what I mean. I would like to know how to do ajax with wordpress plugins but I suppose that's just something that will have to wait.

 

Thanks for taking a look either way.

Link to comment
Share on other sites

This thread is more than a year old.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.