Hy guys,
I'm trying to solve this problem:
I have a jsp page with inside a table generated with dispaytag library and other kind of stuff.
When I press a button, I would like to generate an ajax call reloading just the table and not the whole jsp page, that display correctly the uptated table with also the generated tag pagebanner and pagelinks properly, increasing and decreasing elements founds.
Is there any solution to solve this problem?
Try this.
$.ajax({
type:"POST",
url:"yourpage.jsp",
data :{ yourdata : yourdata },
success: function(data) {
}
});
$(".yourtableClass").load("yourpage.jsp .yourtableClass", { yourdata : yourdata });
Related
I have rows generated in a table dynamically. I am getting the data for the dynamic rows by ajax calls. This loading of dynamic rows is happening at the time of page load. I am not able to access this dynamic data using Jquery. To be specific, I need to iterate through all the rows in the table.Is there a good way to accomplish this?
Also There is no event like button click to load the data. The data is loaded at the time of page loading.
$.ajax({
type: "POST",
url: serviceUrl,
contentType: "application/json",
data: ko.toJSON(getevent),
dataType: "json",
success: function (data) {
$(".childrenrow").each(function(){ //.childrenrow are the dynamically generate table rows
alert("Here"); //This part is not getting exeucuted
//I am planning to check for the the existence of data.children in each .childrenrow once the loop is entered
});
},
error: function () {
}
});
Try this,
As you said your data will be loaded while page load then you can access those data from following code:
$(document).ready(function(){
$("table tr td").each(function(){
alert($(this).text());
});
});
This will iterate through each td of each tr and .text() will return the data inside respective td. You can also use $("table tr").each(function(){ , which will get the data from each tr.
Working js code
I have to make an AJAX call where I retrieve another page, completely. Then I would trim the html received to what I would like to see (styling wise) by removing or adding different stuff. As below:
$.ajax({
type: "GET",
url: "/booking-standard-mykad.html",
dataType: "html",
ifModified: true,
asnyc: true,
error: function() {
alert("Error");
},
success: function(data) {
data = $(data);
data.find(".somecssclass").remove();
//lots of other modifications
$('.book-now').html(data); //then I would display it here
}
});
Now the problem is, I don't seem to be able to remove the styles and scripts that are as well fetched in the head. I would like to keep some of the content in the head, what's below the head, in the body and in the footer.
What I have tried and failed:
data.find("title").nextUntil("script[src='http://thedomain.com/skin/frontend/smartwave/porto/js/porto.js']").andSelf().remove();
//removing whatever there is from <title> to a certain <script> fetched
As well, I have tried the load() function in jQuery, but since I have lots of JS functions in the footer and body that I would need, it didn't quite work. Hence I used Ajax.
Any thoughts on how to remove certain <scripts> , <meta> and <link> tags being fetched?
I solved this problem by fetching data to a third page using jQuery load(), removing whatever styles that I want, and then using an iframe to pull the data from that third page to my destination. All good and fast.
I have a php page which has lot's of code of html and javascript inside it.Ihe other page use ajax to send an id to the first page and get the results and put it inside a div element. Now I want to run those returned codes which contains javascript and html codes.
How should that be done?
This is my ajax request to the first page:
$(document).ready(function() {
$.ajax({
type: "POST",
url: "showing.php",
data: "s_id="+s_id+"&submit=true",
success: function(msg){
str=$.trim(msg)
document.getElementById('tabs-2').innerHTML = str;
document.getElementById("ui-id-2").click();
}
})
I think event delegation can solve your problem.
Like below:
Use $.on(). Instead of registering events on the element you register on a parent which will not be removed
Ex:
$('#tabs-2').on('click', '#ui-id-2', function(){
//do something
})
I have a div block i want it to be automatically referrshed once or twice during when page is loading .
How can refresh/reload the div once or twice using jquery or javascript?
Where is it gonna reload from, what does the block look like ?
I would use jQuery ajax and reload content into the the div
but thats a much as I can say without having any idea about what the content is to look like , what the current content looks like or what you would receive back from an ajax call
hth
I don't know exactly what you mean but try to look this example
$(function () {
setInterval(function () {
$.ajax({
type: "POST",
cache: false,
url: "Ajax/funk.cshtml",
dataType: "text",
success: function (data) {
$('#divId').text(data);
alert('Load completed.');
}
});
}, 2000);
});
here:
setInterval performs the action every 2000 milliseconds;
jax/funk.cshtml - the file which will give you some text as a result(it may contain only #DateTime.Now for example in asp.net and will return time)
if you want renew the div only once you may use the same function for $(#somedive).onload();
or something like that.
Hope it will help!
I have a page where i add,edit and delete menus.For add and edit I have a separate page.When i add or edit menus,i come on the main page where i display the menus,so i print messages as "menu added" or "menu edited".But when i delete the menu,my page does not get refreshed,because i have written the delete code on the same page sing ajax function as follows:
$.ajax(
{
type: "POST",
url: "delete_menu.php",
data: data,
cache: false,
success: function()
{
parent.fadeOut('slow', function() {$(this).remove();});
document.getElementById('showDiv').style.display = '';
}
}
The page does not get refreshed,so the div containing messages like "menus added or edited" does not get hide.I have given id to Div as showDiv.
So can anyone help me to solve this problem.Also when i delete,can anyone tell me how do i display message as "menu deleted" in ajax without page refresh.Thanks in advance.
document.getElementById('showDiv').style.display = 'none';
Since you have referenced jQuery, I would use jQuery syntax instead of Plain Old JavaScript, to keep the syntax cleen.
$("#showDiv").hide();
If you are not going to show the div again on the page, you could use this:
$("#showDiv").remove();