To empty a div and replace it with an image I am using:
$(this).html('');
$('<img/>', {
src: 'blah.gif'
}).appendTo(this);
Is there a better way to do this?
How to submit default data when using $.ajax?
I have tried:
$.ajaxPrefilter(function(options, originalOptions, jqXHR) {
// can't access anything here... (tried jqXHR.data but undefined)
});
$.ajaxSetup({
beforeSend: function(jqXHR, settings) {
// can't access anything here... (tried jqXHR.data but undefined)
}
});
I need this so I can send my CSRF token, each time and when logged in submit the user ID each time. I prefer not to submit a token in headers.
Thanks
I wrote a simple if condition, but not quite working.
if text is 123 change to hi, if text is 456 change it to hi2
Could someone please give me a hand.
<h1>123</h1>
<h1>456</h1>
<h1>789</h1>?
$(document).ready(function() {
var changeText1 = '123';
var changeText2 = '456';
var text = $(h1).text();
if (text == changeText) {
$(this).text('hi');
} else if (text == changeText2 ) {
$(this).text('hi2');
}
});
?
http://jsfiddle.net/8P2ma/
Hi,
I have created image gallery slider, the images of which scale with the window size. My problem is I can't seem to create the right formula to ensure that the slider is at the right position when the window is scaled.
If I am at the first image and the slider 'left' offset is 0 then the scaling works fine and my offset is correct, however when I am on image two and my slider is offset by say -1500 and then the window is resized, the slider is then at the wrong offset.
Taking this into account I figured I could just add / subtract the new window size difference from the slider offset and therefore have everything in the right position. I was wrong. It works for the first two images but then If I am at the end of my slider on the last image I get a nice big gap between the end of the last image and the border of the page.
Can someone please show my where I am going wrong please? I've spent days on this :(
The relevant code is as follows:
$(window).bind('resize', function(event, delta) {
/* Resize work images - resizes all to document width */
resizeWorkImages('div.page.work div#work ul');
/* Position slider controls */
positionSliderControls();
/* Get the difference between the old window width and the new */
var windowDiff = (gLastWindowWidth - $(window).width()) * -1;
/* Apply difference to slider left position */
var newSliderLeftPos = stripPx($('div.page.work div#work ul').css('left')) - windowDiff;
/* Apply to slider */
$('div.page.work div#work ul').css('left',newSliderLeftPos+'px')
/* Update gSlider settings */
gSlider.update();
/* Record new window width */
gLastWindowWidth = $(window).width();
});
Thanks,
eb_dev
Hi guys, I have an HTML form consisting of some text-inputs. I'm using jqTransform to prettify them. Now I want to add two buttons that will add and remove text-input dynamically.
Adding is easy:
$('#container').append('');
$('input[name=foo]:last-child').jqTransInputText();
But removing is tricky:
$('WHAT-TO-SELECT').remove();
I can't do "input[name=foo]:last-child" since it's already wrapped (some divs) by jqTransform. To put this question in another way: How do I select based on "who has child of type input with 'foo' as its name"?
I have a table of names and ages that I want the user to be able to sort. When the page initally loads, sortList lists the rows in order from oldest to youngest, and then secondarily from A to Z.
I want the same thing (a SECONDARY alphabetical sort) when the user actually clicks on the age <th>, but sortForce is making the alphabetical sort primary. Is there an alternative?
$('#super_results table').tablesorter({
sortForce: [[0,0]],
sortList: [[1,1],[0,0]]
});
Or am I misunderstanding sortForce? Documentation here.
hi,
i have a proj where on change of select box i am loading data from server. how do i make sure that until the data is loaded user cant do anything else on the page ..
Hi ,
I'm trying to get all my form inputs and then create with them an xml string containing there values in order to send them via ajax.
i want this :
<form id="formtest">
<input type="text" name="test1" id="test1"/>
<input type="text" name="test2" id="test2"/>
<input type="text" name="test3" id="test3"/>
<input type="text" name="test4" id="test4"/>
<input type="text" name="test5" id="test5"/>
</form>
to become:
<formtest>
<test1></test1>
<test2></test2>
<test3></test3>
<test4></test4>
<test5></test5>
</formtest>
How can this be done?
Thank's In Advance.
function testing() {
$.ajax({
type: "POST",
url: "testing.php",
data: "call="+$("#abc").val(),
success: function(msg){
alert( msg );
}
});
}
I want to post the data to testing.php but if i got special characters like & sign. it will create the problem. How do i go about it?
Thank You
I am dealing with a webpage that has multiple forms..some basic HTML forms and some AJAX forms. I have a created validation for inputs, let me give an example...if an input has a class="required" whenever a submit button is pressed if any required classes are empty then the form doesnt submit. Which works great...until you have multiple forms with required fields that dont apply to the section your submitting.
I am able to find the closest form $(this).closest("form") and it gets me the form element properly, I then need to be able to loop only through the children of that form. I have tried: .children(':input'), .find('input') and honestly to many to list.
Here is the code for when a button is selected
$('#formSubmit').click(function (e) {
var submit = true;
var form = $(this).closest("form");
var formID = $(form).attr("id");
e.preventDefault();
$(form).children(":input").each(function () {
if ($('#ERROR').length > 0) {
submit = false;
alert("Please fix errors to continue");
}
$('.required').each(function () {
if ($(this).val() == "" || $(this).val() == undefined) {
submit = false;
$(this).css({ 'background-color': '#fef236' });
}
});
});
if (submit == true) {
this.form.submit();
}
}); //End of #formSubmit
Also of interest I have started creating forms with ids that are GUID's so they will be unique and allow me to target things without any issues, just wanted to throw that out there if it can help lead to a solution
I appreciate any help =)
Sorry for such a simple question but I can't seem to find the solution.
I am trying to fade in and out some divs.
Divs have an ID of "div1", "div2", "div3".
My code is:
var Divs = new Array("div1", "div2", "div3");
I want to fade out one div and then fade in the next on top of it.
I have a setinterval that runs every 5 seconds and checked it works.
Inside it is this code:
$(Divs[1]).fadeOut(1000);
$(Divs[2]).fadeIn(1000);
However nothing happens when the timer method is ran. Any ideas?
Here's another clichéd problem, but I couldn't find an exact match to this.
I haven't posted any source here, as you can freely see all that is there on the link. :-)
Statement:I have a web page at http://agrimgupta.com/antaragni/
Disclaimer: Pardon me for the pathetic coding on that page. ;-) It was done on a very short interval. Improvements will be done at a later stage.
Observation: This page is functioning normally on my localhost on all browsers.
Problem: IE 8 is crawling (nearly hanging) while loading this page from the website. Although it is working fine on localhost. When on the website, It fails to render the mouseover effects, doing them in almost what seems like a minute.
Question: How to resolve this stuck up of IE? It is necessary to resolve this.
Thanks in Advance
$('.testimonials blockquote p')
.prepend('“')
.append('”');
...prepends and appends TWICE. How do I prepend ldquo + whatever content inside the p + rdquo?
Thanks!
Hi
I am using fanxybox 1.2.6 but it's getting closed despite of mentionig onContentClick:false
Here is the code:
$("#"+vari).fancybox({'hideOnContentClick':false }).trigger('click');
Kindly help me out
p.s: The window is loading content from other URL(via Iframe)
I have an array of divs and I want to iterate over each div and pass it to sparklines. like so:
var divs = $("#wrapper>div");
var data = ["1:2:3:4", "4:3:2:3:1"];
var i;
for(i = 0; i<data.length; i++){
divs[i].sparkline(data[i]);
}
I get the error "divs[i].sparkline" is not a function. But if I do this
divs.sparkline([1,2,3,4]);
its fine all the divs get the linegraph but with the same data.
Does anyone have any suggestions but how to use sparkline when iterating over divs?
Thanks!
<ul>
<li><a href="#">one</a></li>
<li><a href="#">two</a></li>
<li><a href="#">three</a></li>
</ul>
I'd like to show only one li at a time using slide effect, thats it. I'd like to avoid using plugins for something as simple as this.
Thanks in advance for your help.
I am doing a notification system. When a new post is published, users will be notified immediately by an small notification on the screen.
I am currently using this:
setInterval(function(){
checkForChanges();
}, 2*1000);
function checkForChanges(){
$.post("http://"+ document.domain + "/posts/checkForChanges/",
function(dat){
if(dat>0){
....
/*create notification*/
}
});
}
And i was wondering if this is the correct way to do it or not. Because, this is calling a PHP function every 2 seconds and making a query to the database.
In case there are no new changes, it won't do anything...
Thanks.
Take the following example:
$.fn.foo = function() {
var $input = $('<input type="text"/>');
var $button_one = $('<button>One</button>');
var $button_two = $('<button>Two</button>');
$button_one.click(function(){
$input.val('hey');
});
$button_two.click(function(){
$input.replaceWith( $input.val('').clone( true ) );
});
this.append($input, $button_one, $button_two);
};
Check the demo: http://jsbin.com/ezexah/1/edit
Now click "one" and you should see "hey" in the input. Next click "two" and then click "one" again and it doesn't work. Even using the true option in clone to copy all events it still does not work. Any ideas?
Hello, I have an easy script, that works in all browsers, except IE(8, haven't tryed lower versions yet).
$('.deleteItemIcon').click(function() {
var deleteConfirm = confirm('Do you really wanna delete that item?')
if (!deleteConfirm) {
return false;
}
});
Can you see a reason, why that shouldn't be working, if yes, how to make it work?
I have the following function:
var emptyFields = false;
function checkNotEmpty(tblName, columns, className){
emptyFields = false;
$("."+className+"").each(function() {
if($.trim($(this).val()) === "" && $(this).is(":visible")){
emptyFields = true;
return false; // break out of the each-loop
}
});
if (emptyFields) {
alert("Please fill in current row before adding a new one.")
} else {
AddRow_OnButtonClick(tblName,columns);
}
}
Its checking that all elements in the table are not empty before adding a new row, and I only need to check that the last row of the table has at least an element which its not empty and not the whole table.
The className its applied to the table. Please notice, that the problem I have its checking the last row and only one element of the row has to have some text in it. (e.g. each row has 5 textboxes at least one textbox need to have some text inside in order to be able to add another row, otherwise, the alert comes up).
Any help would be apreciated.
Thanks
i want move up the object, delay 1000ms , then hide it,
i get the code:
$("#test").animate({"top":"-=80px"},1500)
.animate({"top":"-=0px"},1000)
.animate({"opacity":"0"},500);
i use ".animate({"top":"-=0px"},1000)" to implement delay, it's not good.
i want:
$("#test").animate({"top":"-=80px"},1500)
.sleep(1000)
.animate({"opacity":"0"},500);
any idea? thanks! :)
I need a function that accepts a parameter with its id example a div
and after that loops inside the div to look for checkboxes and if there is/are any checks if its value is checked and returns true if every checkbox is checked returns false.
This is my Javascript:
$(document).ready(function() {
$('#like').bind('keydown', function(e) {
if(e.keyCode == 13) {
var likeMsg = $('#like').val();
if(likeMsg) {
// Send the AJAX request to like.php
$.ajax({
url: 'like.php',
success: function(data) {
alert('Content: ' + data);
}
});
}
}
});
});
And this is my like.php file:
<?php
echo "It works! :)";
?>
When I press enter on the #like input, it seems the AJAX request is sent and an alert box comes up saying: Content:, but there's no data being sent back from like.php...
I have checked if the file exists and if it's in the same directory and whatever and it is, so I'm pretty much clueless atm.
Does anyone know what could be wrong here? Cheers.
$('#customerAddress').text().replace(/\xA0/,"").replace(/\s+/," ");
Going after the value in a span (id=customerAddress) and I'd like to reduce all sections of whitespace to a single whitespace. The /\s+/ whould work except this app gets some character 160's between street address and state/zip
What is a better way to write this? this does not currently work.