What is the best way or the best programming language or tool to use if i want to load data from web page in a database without refreshing the page ?
$(document).on("click", ".load", function(event) {
var id = $( this ).attr( "data-id" );
$.ajax({
method: "POST",url: "/url/to/ajax",
data: {id: id}
}).done(function( data ) {
$( "body").html(data);
});
});
Use AJAX from the web page to send data to the backend, then the backend should take care of the data received to save it in the database.
Related
I want to count how many times my menu items are clicked. for this task, I have a visited cell in my menu table that is retrieved by some models. the menu items are shown on my layout.phtml each specified by their id and I am trying to use ajax for this matter as below:
### menu items in layout.phtml
<li>about</li>
### ajax code
$(document).ready(function(){
$('a#menuItems').click(function () {
var data={};
data.id =$(this).attr("data_id");
$.ajax({
type : 'POST',
url :'../../../module/Application/src/Model/visitCounter.php',
data :data,
success: function(data){
},
error:function(){
}
});
});
});
the visitCounter.php is a service model that gets the variables via POST method do the rest of the work but the problem is how to send this ajax request to the service model page. I wonder if there is a way to achieve that without any controller.
I really appreciate if anyone could help me with this.
I'm trying to develop a wordpress plugin, I need to get users input data from any form in a specific page (not knowing its action) I come up so far with this solution which is to get values using javascript and then passing it to php:
jQuery(function ($) {
$(document).ready(function(){
$( "form" ).submit(function( event ) {
if($( "form" ).valid()){
var inputs = $( "form input" );
var inputValues = [];
inputs.each(function(index){
if($(this).attr('type') !== 'submit')
inputValues.push($(this).val());
});
}
event.preventDefault();
});
});
});
I tried to pass the Javascript variable inputValues to my plugin using Ajax
$.ajax({
type: 'POST',
url: '../wp-content/plugins/myplugin/myplugin.php',
data: {'variable': inputValues},
});
But I get problems with the url for some pages and I couldn't use $_POST['variable'] in myplugin.php file.
Is there a way to accomplish what I'm trying to do, or do you know an alternative solution?
Thanks in advance.
in terms of how to implement AJAX calls using WordPress, please check out the WordPress Codex. You're not doing it correctly.
JavaScript seems like a round about way of doing this. I would suggest to hook into one of hooks that are being called almost every single time like template_redirect (https://codex.wordpress.org/Plugin_API/Action_Reference/template_redirect).
Then you can check what's in the $_POST variable and do what you need to do with it. This would even Capture AJAX forms as long as the URL links to a proper AJAX WordPress endpoint.
Hope this helps
I have a classic asp page that fetches data from a table. I have a button to update some values in the database. This is the code I have used.
Code in SelectData.asp
<p>
<input type="button" value="Reset" onclick="location.href='RecordsUpdate.asp'"></p>
When I click the button it redirects to RecordsUpdate.asp page and updates the database (RecordsUpdate.asp has the code to update the database and it's working fine). I need to update the database but I don't want to navigate to RecordsUpdate.asp page. I need to stay on SelectData.asp page itself, but when I click the button the data should be updated in the database. How can I do that?
Please help me out.
Thanks In Advance,
Abhilash D K
You'd be best off using jQuery for this so you can capture the button 'onclick' and use Ajax to "get" the RecordsUpdate.asp page:
<input id="mybutton" type="button" value="Reset">
<script>
$("#mybutton").on("click", function(e) {
e.preventDefault();
$.get( "RecordsUpdate.asp", function( data ) {
//data will be the output from `RecordsUpdate.asp`
alert( "Load was performed." );
});
});
</script>
I am able to call an .asp page without navigating to it. This the code that I used.
$(document).ready(function () {
$("#updatebutton").on("click", function (e) {
e.preventDefault();
$.ajax({
type: "POST",
url: "RecordsUpdate.asp"
})
.done(function (msg) {
alert("Data Saved");
});
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
Thank You all for helping me out.
Abhilash D K
You need to do this with javascript. Look here for more info: http://www.w3schools.com/ajax/ajax_xmlhttprequest_create.asp
If you are using jQuery, use this http://api.jquery.com/jquery.ajax/
With the success callback you can retrieve some responsedata so you can notify the user if you want. This ain't rocket science.
i wanna have a Faceook-Feature in my website: Everytime a user gets a Private Message, the title should be change in something like "[1 PM] TITLE",
How to do that?
I know its easy to change the page-title, the question is how to run a database query every 10 seconds (or is that to often?) and change the title - Without an user interaction (ajax?)
You can use jquery setInterval to make a AJAX request after a certain interval to get data from the db.
$(function(){
setInterval(function() {
$.ajax({
url: "page.html",
success: {
document.title ='new title';
},
error: function(){
//error occurred
}
});
}, 2000);
});
And on AJAX success you can change the page title.
I am having no luck in getting a jqueryui dialog to ajax load a form, which inturn submits via ajax.
Everything works upto the point of catching the form that is being submited and instead sending it through an ajax call. Thus the form action is triggered and the browser redirected. The ajax call is never made.
My code is as follows
$(document).ready(function() {
$('.viewOrder').click(function() {
$('#displayOrder').load(this.href, [], function() {
console.log("landed here");
$('#blah').click(function() {
console.log("submiting the form via ajax");
$.ajax({
url: "/ajax/orderupdate",
type: "GET",
data: data,
cache: false,
//success
success: function (data) {
console.log("worked:");
}
});
return false;
});
});
return false;
});
});
.viewOrder is the a href that is ajax loaded. This works fine.
I have read many similar questions on here and it seems load() does not execute scripts that are embeded in the return html, but my return code is pure html no scripts. Any ideas?
IMHO you should try and capture the submit instead of the click, that way you prevent submits done by keyboard aswell, and it might even fix your problem.
The events are bound on page load. At page load the form you are binding the click event does not exist. I use the livequery plugin but they added Live to jquery 4 which you can also use(i had some issues with IE so i went back to livequery)
So load livequery with your scripts http://docs.jquery.com/Plugins/livequery
and change
$('#orderUpdate').submit(function() {
to
$("#orderUpdate").livequery("submit", function() {