Im using the jquery form wizard [URL] to create a form wizard. In one of the steps i need to populate some inputs based on the value of another input from a previous step.How can i do this? For ex: On step 1 i have two inputs. In one of them i need a time interval in days. On step 2 i have a datepicker witch should have the value of the current time + the number of days from the input in step 1.
View 1 Replies
I'm creating a step by step form using jquery ui tabs andvalidation plugin, the problem is that I've got just one form ( and Ihave to ) so on first step the form is validated but all errors anothers steps are displayed.I'm using an approach ofbut I've got specific messages and validations.Something like
var v=$("#saverForm").validate(
{
debug: true,
[code]....
I'm trying to include jquery 1.4 in a xul wizard, and the xul wizard just breaks, with any error message in the error console.
View 2 Replies View RelatedI was wondering if it's possible to make it so that once a user selects a certain option in a list, it makes the next input for that form change to either a textfield or a list without losing the values entered in the inputs above.I know PHP is a server-side script, does that make this not possible?
View 3 Replies View RelatedI had a problem with the jquery formwizard plugin, when trying to add new steps by this code creates error in a sense that I can't click next, because the validate plugin validates the next form, even though the user didn't go to the next step yet.
Then all the other ajax drop down forms won't function properly in the new duplicated steps eventhough I used the .live() function What's wrong with my code? About form wizard, it divides your one form into alot of parts using span id as the name of the separate page and the class = step or step_submit as next step or submit page
<div id="frmWrapper">
<form id="signupForm" method="post" action="" class="bbq">
<div id="fieldWrapper">
<span class="stepinfo">Registration</span><br />
<span class="step" id="personal">
[Code]...
I'm using formwizard, and I tried to insert a dropdown into the form by putting this jquery code
$('#aog').change(function() {
if ($('#aog').val()==='yes') {
$.ajax ({
type: "POST",
url: "<?php echo base_url(); ?>index.php/register/mortgator",
data: "aog=" + $('#aog').val(),
success: function(msg) {
$("#bank").html(msg);
$("#signupForm").formwizard("update_steps");
}}); //end of ajax
} else {
$("#bank").html('');
}});
//end of aog event
And this php code
function mortgator(){
$this->load->model('MBank');
$q = $this->MBank->getbanklist();
echo '<label for="mortgator">Mortgator:</label><br/>';
echo '<select name="mortgator" id="mortgator" class="required ui-wizard-content ui-helper-reset ui-state-default error">';
echo '<option value="">Select a Mortgator</option>';
foreach ($q as $key => $list){
echo '<option value="'.$list['bankID'].'">'.$list['bankName'].'</option>';
} echo '</select>';
}
It is working, except that when you click next, other form input boxes would fade, but this input inserted via ajax would not have a fade animation. That's why I added this line of code to the html tag ui-wizard-content ui-helper-reset ui-state-default error but it appears that that does not work.
I want to make a popup helps the user select a value for an input field in a html form.
For example, if the field is for a customer code - the user can either type in the customer code directly, or use the popup to search on available customer codes using various criteria and finally select the customer code he or she wants to use, and have that customer code populate back into the original input field.
I have been looking around the various components in jquery but can't quite see how to do this.
I'm looking to make a form that could potentially span over several steps (or pages) and have the details submitted to an email address. How can I split the form into multiple steps, so step 1 includes 5 questions, click next, then step 2 includes the next 5 questions, then on submit it emails the details (from both step 1 & 2) to a specific email address in one email?
If anyone could point me in the right direction or give me a hand that would be great. I've spent ages looking for some answers.
I'm just starting up in web design and I have an interesting challenge that I'm hoping can be solved w/java script. I have a site with an application form. When the form is to be submitted, the form data needs to be emailed to the correct person to handle that particular application. However, that can't be determined by anything specific in the form. It can only be determined by the link that they clicked on to get to the form. I really don't want to have 22 identical forms with just a different EmailTo addie, which is what the previous site developer did. Someone please tell me this can be done w/java script? If not w/java script
View 4 Replies View RelatedI have a problem with adding new inputs to a form (if and when required),Internet Explorer is fine but in Firefox if any previous input fields are filled when the more button is clicked they get reset to blank.JS:
fields = 0;
function addInput() {
if (fields != 100) {
[code].....
I have a shopping cart and i want to find the previous text box value.[code]
View 1 Replies View RelatedSite in question:On the 3rd step of this form, I want to add a "SKIP" button that will send the user to the 5th step. No clue how to do thisjavascript file:
//step 3
$('#submit_third').click(function(){
//remove classes
[code].....
When you press the down key while in an input field the default
behavior for some event creates a dropdown of the previously input
text. What event creates that behavior and how do I stop it ?
For example, to prevent ANY type of default behavior when clicking ANY
key, I thought this would work, but the dropdown still occurs. What am
I doing wrong ?
In html file:<body >
Search Text: <input type='text' id='searchtext' />
in javascript file:
function blank(){
return false;
}
function registersearch(){
document.getElementById("searchtext").
document.getElementById("searchtext").
document.getElementById("searchtext").
document.getElementById("searchtext").
}
I'm trying to add extra DIVs after the first one on a page. This is for a CMS with form fields in them. Here is the first DIV:
<div class="OptExtra">
<h3>Additional Option</h3>
<label for="RESAddType">File type (i.e. “CD” or “Download”)</label>
<input name="RESAddType[]" type="text" id="RESAddType" size="48" class="FW" />
[Code].....
I have a form that uses several text fields to set the footer of the current page. The fields are "Company name", "Street", "Town" and things like that. When a keystroke occurs in one of those fields, I update the footer with the corresponding info, using the "onkeyup" event. All this works fine. My form also has some checkbox to tell if the infos in the footer must be separated with bullet characters. In such case a bullet must be appended to the string retrieved from the current field, but only if the next footer info is not empty or does not start itself with a bullet. Similarly, if the previous footer info is empty and does not end with a bullet, a bullet must be added at the beginning of the current string. So, I have to make the UpdateFooter() function here below more subtle. From the "this" argument passed to that function, I've been unable to find with jQuery the previous and next <li>-encapsulated "siblings". I'm not sure that I really catched how to use "previous()" and "next()" efficiently.
(...)
<fieldset name="footer_infos" class="invisible">
<ul>
<li>
<input name="footer_company" type="text" size="14" maxlength="36"
[Code].....
In the following code - Sometimes I get the correct image width and sometimes I get an image width that is ZERO. How do I make sure the loaded image attributes are there before I access them. Odd thing is if I click the same thumbnail twice I always get the width. If I click a thumbnail once I may get the width this time BUT when I refresh I may get a ZERO width.
Here is the code...
$(document).ready(function() {
$('#gallery a').click(function(evt) {
evt.preventDefault();
var oldImage = $('#photoBox img'); // Selects the current image
var newImage = new Image(); // Create a new image
var imagePath = $(this).attr('href'); // get the path to the image file to load that was clicked - via its href attr name
newImage.src = imagePath;// Set the newIamge.src to file name or Path
if (newImage.width < 600) // If the width is less than 600 calculate a new margin to center the new image {
var newMargin = (620 - newImage.width) / 2;
var newHtml = $('<img src="' + imagePath + '">');
$('#photoBox').css('margin-left',newMargin);
$('#photoBox').css('width',newImage.width);
} else
// assume width is 600 {
var newHtml = $('<img src="' + imagePath + '">');
$('#photoBox').css('width',newImage.width);
$('#photoBox').css('margin',5);
} newHtml.hide(); // hide the newHtml before prepending will fade it in
oldImage.hide(); // hide the old image
$('#photoBox').prepend(newHtml); // prepend the newHtml
newHtml.fadeIn(1000,function() { }); // now fade it in
});});
In pseudo code, here's what I'm trying to do with some text:
shrinkText.changeText.EnlargeText.
The jQuery I'm using for this:
$('span#calendarNumber').animate({
color: '#999',
fontSize: '12px'
}, 500 ).html($('#calculatorSampleInPopup1').val()).animate({
color: '#900',
fontSize: '40px'
}, 2500, 'easeOutElastic' );
What happens visually upon triggering this is this:
- HTML content changes
- text shrinks
- text enlarges
I think what is happening is that the first animation is suppose to span 500 (miliseconds?) but jQuery doesn't pause for that, it just starts the animating and goes immediate to the second event which is to change the text. In otherwords, I think it's triggering correctly, it's just not producing the visual effect I want. Is the solution to put a pause of some sort between the first two events? If so, what's the proper method?
Jqtransform Firefox Input Problem Basic problem is the text inside of the form input is lower than it should be.
View 2 Replies View RelatedI am using some Javascript to open up a pop up window...
<script type="text/javascript">
//<![CDATA[
function editText() {
[code]....
This works fine and within that popup window I have the following:
<form action="index.php" method="post">
<textarea name="userInput" id="userInput" cols="32" rows="10"><?php echo $_SESSION['greeting'];?>
I have a page which contains various form elements and at the end of the page is a link to another page. I'm using
<form method="get" name="form1" action="Outcome.htm">
on the first pageand I've got the following code on the second page...
function GetVars()
{
var dl = document.location;
[code].....
I have a application that uses jquery-1.6.4.jsandjquery-ui-1.8.14.custom.min.js. A call is made by a js file that works if I break on the call and single step using firebug but when run w/o the single step the call to the php in the server never seems to occure. IE doesn't seem to have this problem
View 4 Replies View Relatedi'm New to JQuery and I recently had a problem with encorporating a transition at the beginning and end of my carousel. I found that by default it would Fast Forward/Fast Rewind through all the images at the ends, rather than just jump to the slide and wrap.
I've managed to solve the issue (bar a transition effect from the last slide back to the first) it now jumps to slide one, rather than rewinding through all the images. However (and i know this sounds silly) but i'm having trouble doing the reverse. I'll add both the zip file to show a working model if interested and also post the 2 relevant functions :)
[Code]...
So I have an order form which gets all validated with fields, checkboxes, radiobuttons and so on...after submiting I would like to show pictures related to what was order/picked...as of right now when I click sumbit it just shows no "error message/validation errors" since the information is just correctly entered but I would now like to go to another page? clear current page and basically show images...say my radiobuttons was car selection with options bmw, audi, lexus ect...now after submiting a new page loads ontop? showing a picture of the brand selected? how would I go abouts doing this?
View 2 Replies View RelatedI need a dropdown menu that go directrly to the link on select.
I don't want a 2 steps dropdown (select + submit)
I rather want a submit on select.
Like the Apple Store Locator on apple.com.
This dropdown is connected to a MySQL DB with PHP.
I have some half-working script I'm playing with that I half-understand (this is the real problem) which I'm having troube debugging because it always does work when I refresh.So whenever I step through my functions with Firebug everything does what I expect it to do: but if then I re-invoke my onchange event, not every step is taken and it's hard to see why because I can't "see" what it's doing after the page has loaded and the script run at least once.This is for hide-and-show in a form and all the other versions I see online are even less understandable than what I've got so far. So I figure I'd better debug the one I have.Anyone know how to re-watch a script onevent?
View 4 Replies View RelatedI've have a function to take the value entered in a form text box, add 50 to it and put the result in another text box.
When I enter 650.5 I get 700.5 exactly how I'd expect. But when I enter -650.5 instead of getting -600.5 I get -650.050 as though it is failing to parse the float due to it being negative. My understanding of parseFloat was that it recognises negative numbers. Is there a nice simple way to get this to work?
