Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
We have a simple jquery ajax call
we made a more button and on button click it call another php file
on my local computer server its working good even once it work good on when i made it live on server but suddenly it stop working live.
Following code working good on local computer server but when i made it live then its not working
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<div align="center"><input type="button" id="morejobs" class="m-btn blue buttonSmall tmargin" data="?id=111&page=2" value="More Jos ยป" /></div>
<script type="text/javascript">
$("#morejobs").click(function () {
var datavalue = $(this).attr("data");
//$("#morejobs").text('Loading..');
if (datavalue) {
$.ajax({
type: "GET",
url: "new_keyword_city_common.php",
data: datavalue,
cache: false,
success: function (data) {
$("#friendsugmore").html('');
$("#friendsugmore").html(data);
}
});
}
return false;
});
</script>
What can be issue when same code working good on local server but not live
You say your files are in the root. What you can try is to add / before the file to force it to take the root:
url: "/new_keyword_city_common.php",
If this doesn't work try an absolute path. Add the whole domain name before the PHP file. For example:
url: "http://yourdomainhere.com/new_keyword_city_common.php",
Related
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 1 year ago.
Improve this question
I'm working on my personal website and have implemented a preloader.
After adding a second div to my website, I noticed I can scroll during the page loading. I dunno about you but I find that ugly and disturbing.
Here is a quick video. (I use chromeOS)
Video
I really couldn't find anything on this because I think I was the only one with this problem. I'm not sure, however.
I used $(window).on("load",function(){$(".loader-wrapper").fadeOut("slow");}); as well
Here is the code (Github Repo)
Anyways, that's all I got.
Thanks in advance.
You can add by default a class to your body the class should be as follows.
// CSS
.no-scroll {
overflow: hidden;
}
<body class="no-scroll">
Once your script has completed or your function finishes you just call
document.body.classList.remove('no-scroll');
Make sure to add the following section at the end of your page.
<script type="text/javascript">
(function(){
function onReady() {
document.body.classList.remove('no-scroll');
}
if ( document.readyState === 'complete' ) {
onReady();
} else {
document.addEventListener('DOMContentLoaded', onReady);
}
})();
</script>
Or you can do it with jQuery
// Make sure this code is the last piece of code in your HTML.
$(window).on("load", function() {
document.body.classList.remove('no-scroll');
});
PS: Additionally to that consider the unlike scenario when someone does not have JavScript enabled so you add a default behavior. Take a look at <noscript> tag.
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 5 years ago.
Improve this question
Hey I was trying to submit a form with ajax, but the code I wrote submits it on pretty much every button you press on that page. I need to limit it to only a specific button with specific ID when I changed it to be ("#formId").submit it doesn't work here is the code
<form id="formId" method="post">
<table>
some table content
</table>
</form>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery(":submit").click(function (e) {
e.preventDefault();
var form = $(this.form);
jQuery.ajax({
type: "POST",
url: "test.php",
data: form.serialize() + "&" + this.name + "=" + this.value,
success: function(data) {
alert("good stuff");
}
});
});
});
</script>
Keep in mind that code is being generated by while loop (when selecting stuff from database) and I put the JS code at the bottom after the loop.
Assign your event to the actual form and change the event to submit instead of click:
jQuery("#formId").on("submit", function (e) {...}
Give every button a different ID and try the code below, or at least implement something like the code below.
<script type="text/javascript">
document.getElementById("button_id").addEventListener("click", function (e) {
$.ajax({
type: "POST",
url: "path_to_script.php",
data: $("#form_id").serialize(), // serializes the form's elements.
success: function(data) {
alert("Congratulations this works");
}
});
e.preventDefault(); // avoid to execute the actual submit of the form.
});
</script>
Let me know if this works
Try this.
$("#formId :submit").on("click",function(){
// your ajax code is here...
})
So I'm trying so so hard to find something for JavaScript or jQuery where I can use a lazy loading plugin or SOMETHING that goes a little like this:
if .post IS_NOT_IN_VIEW do{
dont_load();
}else{
load();
}
I could've made that better xD. But hopefully you can understand what I mean by that. I just want something that'll STOP the loading of my content with a class of "post" but it'll load it when the user has the content in view.
Thank you if you can help... I had already posted a question like this but people just had problems with the post and I guess people just didn't even bother to look at it seeing it had 6 or 7 comments...
I think ajax addresses your question.
http://api.jquery.com/jquery.ajax/
You can load resources using this.
HTML:
$.ajax({
method: "get",
url: "some_url",
dataType: "html"
})
.done(function( data ) {
alert( "HTML content: " + html);
});
Or for json just change the dataType to json.
If you want to lazily load javascript:
How to dynamically insert a <script> tag via jQuery after page load?
Has some helpful answers.
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
The following code does not work on jsFiddle even when have set the correct Framework and extension, i.e. jquery 1.7.2 and no-wrap in body.
HTML Code
Name:<input data-bind="value: name" />
<p>Hello, <span data-bind="text: name"></span></p>
<button data-bind="click: changeName">Change Name</button>
Javascript Code
$(function () {
var viewModel = {
name: ko.observable("bob"),
changeName: function () {
this.name("steve");
}
};
ko.applyBindings(viewModel);
});
Make sure you have included jQuery as well as KnockoutJS library while creating your JSFiddle. One of them will be in external resources section on left sidebar because JSFiddle does not provide feature to include both at one go in frameworks and extensions section..
http://jsfiddle.net/yLcqd06q/1/
$(function(){
var viewModel = {
name: ko.observable("bob"),
changeName: function () {
this.name("steve");
}
};
ko.applyBindings(viewModel);
});
Tip for you : Always mention the error you get in console while posting such questions :-)
Hope that helps..
Peace, RP
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
I have a jQuery function that basically toggles a div on click but it doesn't work I can't tell if I maybe imported the library incorrectly or what but I can't get it to function at all. Please tell me if I am missing anything or messed up my code somewhere.
My exact code looks like this:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("a.notifications-dropdown-trigger").click(function () {
$('#post-notifications-dropdown').toggle('slide', {
duration: 100,
direction: 'up'
});
});
});
</script>
The HTML markup:
<a class="notifications-dropdown-trigger">click me</a>
<div id="post-notifications-dropdown">
.... code
</div>
Everything is coded directly onto servers and is live the moment I save.
You can simply use .slideToggle()
Description: Display or hide the matched elements with a sliding motion.
Code
$(document).ready(function(){
$("a.notifications-dropdown-trigger").click(function (event) {
$('#post-notifications-dropdown').slideToggle(100);
event.preventDefault();
});
});