My HTML table populates its rows dynamically. One of the table data is a dropdown with thesame options. What I want to do is when I change the value of the first, the remaining dropdowns on the other rows will have a selected value, thesame as what is recently selected.
If I change the selected value on the second row, the rest of the dropdowns will be like the second, without affecting the value of the first. Here are a few codes:
<table id="CheckDetails" width="60%">
<tr>
<th>Date</th>
<th>Category</th>
<th>Description</th>
<th>Amount</th>
</tr>
<tr class="row1">
<td><input name="date1" id="date1" class="" value="22-09-2013" /></td>
<td><select name="category" id="cat0" class="dropdown" >
<option value="0">[-- Please Choose --]</option>
<option value="1">References</option>
<option value="2">Inspirational</option>
</select>
</td>
<td><input type="text" class="entry" name="desc" id="desc0" value="1"/></td>
<td><input type="text" class="entry" name="amt" value="420.83333333333"/></td>
</tr>
<tr class="row1">
<td><input name="date1" id="date1" class="" value="22-09-2013" /></td>
<td><select name="category" id="cat0" class="dropdown" >
<option value="0">[-- Please Choose --]</option>
<option value="1">References</option>
<option value="2">Inspirational</option>
</select>
</td>
<td><input type="text" class="entry" name="desc" id="desc0" value="1"/></td>
<td><input type="text" class="entry" name="amt" value="420.83333333333"/></td>
</tr>
<tr class="row1">
<td><input name="date1" id="date1" class="" value="22-09-2013" /></td>
<td><select name="category" id="cat0" class="dropdown" >
<option value="0">[-- Please Choose --]</option>
<option value="1">References</option>
<option value="2">Inspirational</option>
</select>
</td>
<td><input type="text" class="entry" name="desc" id="desc0" value="1"/></td>
<td><input type="text" class="entry" name="amt" value="420.83333333333"/></td>
</tr>
I am working with php for this project. Any help is appreciated. Thanks!
Try
$('select[name="category"]').change(function(){
var $this = $(this), $nextAll = $this.closest('tr').nextAll('tr').find('select[name="category"]');
$nextAll.val($this.val())
});
Demo: Fiddle
Related
I want to have an update option in my html form in which user enters First_name then all the fields should be autofilled with corresponding values in mysql table.
I tried to use autocomplete attribute in few fields and it is not working.Please check the code and let me know if there is any error.Or any other way to implement the requirement.
<form method="post" action="demo1.php" autocomplete="on">
<link rel="stylesheet" href="contact_css.css">
<!--Create a table -->
<table>
<tr><td><b>Contact Information</b></td>
</tr>
<tr>
<div class="leftside">
<td>ContactID</td>
<td><input type="text" name="ContactID" autocomplete="ContactID"></td>
</div>
<div class="rightside">
<td>ContactOwner</td>
<!-- <td><input type="text" name="ContactOwner"></td>-->
<td><select name="ContactOwner">
<option value="None">None</option>
<option value="Malik">Malik</option>
<option value="Manish">Manish</option>
<option value="Ankit">Ankit</option>
<option value="Vikrant">Vikrant</option>
</select></td>
</div>
<tr>
<div class="rightside">
<td>LeadSource</td>
<td><select name="LeadSource">
<option value="None">None</option>
<option value="Advertisement">Advertisement</option>
<option value="ColdCall">ColdCall</option>
<option value="EmployeeReferral">EmployeeReferral</option>
<option value="ExternalReferral">ExternalReferral</option>
<option value="OnlineStore">OnlineStore</option>
<option value="Partner">Partner</option>
<option value="Web">Web</option>
<option value="TradeShow">TradeShow</option>
</select></td>
<!--<td><input type="text" name="LeadSource"></td>-->
</div>
<div class="leftside">
<td><label for="First_name">First_name</td>
<td><input type="text" id="First_name" name="First_name" autocomplete="First_name"></td>
</div>
</tr>
<tr>
<div class="rightside">
<td>Middle_name</td>
<td><input type="text" name="Middle_name" autocomplete="Middle_name"></td>
</div>
<td>Last_name</td>
<td><input type="text" name="Last_name" autocomplete="Last_name"></td>
</tr>
<tr>
<td>AccountName</td>
<td><input type="text" name="AccountName"></td>
<td>EmailID</td>
<td><input type="text" name="EmailID"></td>
</tr>
<tr>
<td>Department</td>
<td><input type="text" name="Department"></td>
<td>Phone</td>
<td><input type="text" name="Phone"></td>
</tr>
<tr>
<td>Mobile</td>
<td><input type="number" name="Mobile"></td>
<td>Fax</td>
<td><input type="number" name="Fax"></td>
</tr>
<tr>
<td>DOB</td>
<td><input type="date" name="DOB"></td>
<td>Assistant</td>
<td><input type="text" name="Assistant"></td>
</tr>
<tr>
<td>AsstPhone</td>
<td><input type="number" name="AsstPhone"></td>
<td>ReportsTo</td>
<td><input type="text" name="ReportsTo"></td>
</tr>
<tr>
<td>LinkedIn</td>
<td><input type="text" name="LinkedIn"></td>
<td>CallStatus</td>
<td><select name="CallStatus">
<option value="None">None</option>
<option value="AnsweringMachine">AnsweringMachine</option>
<option value="Callback">Callback</option>
<option value="NotInterested">NotInterested</option>
<option value="Prospect">Prospect</option>
<option value="WrongContact">WrongContact</option>
<option value="PerformedInternally">PerformedInternally</option>
<option value="LessThan30Employee">LessThan30Employee</option>
</select></td>
</tr>
</table>
<!-- Second table-->
<table>
<tr><td><b>Address Information</b></td>
</tr>
<tr>
<div class="leftside">
<td>Street</td>
<td><input type="text" name="Street"></td>
</div>
<div class="rightside">
<td>OtherStreet</td>
<td><input type="text" name="OtherStreet"></td>
</div>
</tr>
<tr>
<div class="leftside">
<td>City</td>
<td><input type="text" name="City"></td>
</div>
<div class="rightside">
<td>State</td>
<td><input type="text" name="State"></td>
</div>
</tr>
<tr>
<td>Zip</td>
<td><input type="text" name="Zip"></td>
<td>Country</td>
<td><input type="text" name="Country"></td>
</tr>
</table>
<!--Third table-->
<table>
<tr><td><b>Description Information</b></td>
</tr>
<tr>
<td>Description</td>
<td><input type="text" name="Description" class="Description"></td>
</table>
<button type="button">Cancel</button>
<!-- <button type="submit">Save and New</button>-->
<button type="submit">Save</button>
</form>
</body>
This is not how autocomplete attribute is working.
Definition and Usage
The autocomplete attribute specifies whether or not an input field
should have autocomplete enabled.
Autocomplete allows the browser to predict the value. When a user
starts to type in a field, the browser should display options to fill
in the field, based on earlier typed values.
Note: The autocomplete attribute works with the following
types: text, search, url, tel, email, password, datepickers, range,
and color.
SYNTAX
<input autocomplete="on|off">
This attribute can have only value on or off
Refer to w3schools docs for more details
If you want to have a default value in those fields you can set it inside value attribute or design your database with DEFAULT values.
So you can change <input type="text" name="ContactID" autocomplete="ContactID"> to <input type="text" name="ContactID" value="ContactID">
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 5 years ago.
Improve this question
Guys following is my html code.
<form method="post">
<table class="table-entry" cellpadding="1" cellspacing="0" width= "100%">
<tbody>
<tr>
<td><input type="label" name="team" id="team" value="Team:" readonly="readonly" /></td>
<td>
<input list="tm" name="teamv" id="teamv" placeholder="Team" />
<datalist id="tm">
<option value="Pre-press"></option>
<option value="eBooks"></option>
</datalist>
</td>
</tr>
<tr>
<td><input type="label" name="prno" id="prno" value="Project No.:" readonly="readonly" /></td>
<td>
<input list="prct" name="prjctv" id="prjctv" placeholder="Project Number" />
<datalist id="prct">
<option value="Project001"></option>
<option value="Project002"></option>
</datalist>
</td>
</tr>
<tr>
<td><input type="label" name="isbn" id="isbn" value="ISBN:" readonly="readonly" /></td>
<td><input type="number" name="isbnv" id="isbnv" maxlength="13" placeholder="ISBN" /></td>
</tr>
<tr>
<td><input type="label" name="eisbn" id="eisbn" value="eISBN:" readonly="readonly" /></td>
<td><input type="number" name="eisbnv" id="eisbnv" maxlength="13" placeholder="eISBN" /></td>
</tr>
<tr>
<td><input type="label" name="title" id="title" value="Title:" readonly="readonly" /></td>
<td><input type="text" name="titlev" id="titlev" placeholder="Title" autocomplete="on" /></td>
</tr>
<tr>
<td><input type="label" name="authr" id="authr" value="Author:" readonly="readonly" /></td>
<td><input type="text" name="authrv" id="authrv" placeholder="Author" autocomplete="on" /></td>
</tr>
<tr>
<td><input type="label" name="publr" id="publr" value="Publisher:" readonly="readonly" /></td>
<td><input type="text" name="publrv" id="publrv" placeholder="Publisher" autocomplete="on" /></td>
</tr>
<tr>
<td><input type="label" name="page" id="page" value="Pages:" readonly="readonly" /></td>
<td><input type="number" name="pagev" id="pagev" placeholder="Pages" /></td>
</tr>
<tr>
<td><input type="label" name="scope" id="scope" value="Scope:" readonly="readonly" /></td>
<td>
<input list="scp" name="scopev" id="scopev" placeholder="Scope" />
<datalist id="scp">
<option value="PDF to ePub"></option>
<option value="PDF to PRC"></option>
</datalist>
</td>
</tr>
<tr>
<td><input type="label" name="process" id="process" value="Process:" readonly="readonly" /></td>
<td>
<input list="prcs" name="processv" id="processv" placeholder="Process" />
<datalist id="prcs">
<option value="Reflow"></option>
<option value="Fixed"></option>
</datalist>
</td>
</tr>
<tr>
<td><input type="label" name="complx" id="complx" value="Complexity:" readonly="readonly" /></td>
<td>
<input list="cmplx" name="complxv" id="complxv" placeholder="Complexity" />
<datalist id="cmplx">
<option value="Light"></option>
<option value="Simple"></option>
<option value="Medium"></option>
<option value="Complex"></option>
<option value="Heavy Complex"></option>
<option value="Custom"></option>
</datalist>
</td>
</tr>
<tr>
<td><input type="label" name="recdte" id="recdte" value="Received Date:" readonly="readonly" /></td>
<td><input type="date" id="recdtev" name="recdtev" /></td>
</tr>
<tr>
<td><input type="label" name="cnfdte" id="cnfdte" value="Confirm Date:" readonly="readonly" /></td>
<td><input type="date" id="cnfdtev" name="cnfdtev" /></td>
</tr>
<tr>
<td><input type="label" name="duedte" id="duedte" value="Due Date:" readonly="readonly" /></td>
<td><input type="date" id="duedtev" name="duedtev" /></td>
</tr>
<tr>
<td><input type="label" name="esthr" id="esthr" value="Estimated Hours:" readonly="readonly" /></td>
<td><input type="text" name="esthrv" id="esthrv" placeholder="Estimated Hrs" /></td>
</tr>
<tr>
<td><input type="label" name="manpwr" id="manpwr" value="Man Power:" readonly="readonly" /></td>
<td><input type="number" name="manpwrv" id="manpwrv" placeholder="Manpower" /></td>
</tr>
<tr>
<td><input type="label" name="dlvrydte" id="dlvrydte" value="Delivery Date:" readonly="readonly" /></td>
<td><input type="date" id="dlvrydtev" name="dlvrydtev" /></td>
</tr>
<tr>
<td colspan="2" align="center"><input type="submit" name="add" id="add" value="Add" /></td>
</tr>
</tbody>
</table>
</form>
Now what i need is, to display the data stored in database, in their respective fields based the option selected first.
Example:
<tr>
<td><input type="label" name="team" id="team" value="Team:" readonly="readonly" /></td>
<td>
<input list="tm" name="teamv" id="teamv" placeholder="Team" />
<datalist id="tm">
<option value="Pre-press"></option>
<option value="eBooks"></option>
</datalist>
</td>
</tr>
<tr>
<td><input type="label" name="prno" id="prno" value="Project No.:" readonly="readonly" /></td>
<td>
<input list="prct" name="prjctv" id="prjctv" placeholder="Project Number" />
<datalist id="prct">
<option value="Project001"></option>
<option value="Project002"></option>
</datalist>
</td>
</tr>
In above code if am selecting any one of the team i.e either pre-press or ebooks, the project number relevant to the team should be listed from the database instead of giving it like this:
<input list="prct" name="prjctv" id="prjctv" placeholder="Project Number" />
<datalist id="prct">
<option value="Project001"></option>
<option value="Project002"></option>
</datalist>
Can someone help me with this. i've already tried some methods but of no use.
Guys if cant understand a question just ask for clarification, don't just put the question on hold.
Thought this would be best for newbies but its not. If am genius to find the solution why hell should i need help from people out there.
Am really very disappointed.
First you need to get the data from the database. Here a doc regarding pdo: http://php.net/manual/en/mysqli.quickstart.prepared-statements.php
then, set the attribute seleted of your option if it is the same as in the database:
<input list="prct" name="prjctv" id="prjctv" placeholder="Project Number" />
<datalist id="prct">
<option value="Project001" <?php echo $databasevalue == "Project001" ? 'selected=true':""; ?>></option>
<option value="Project002" <?php echo $databasevalue == "Project002" ? 'selected=true':""; ?>></option>
</datalist>
Inline not the nice way, but it does the trick and shows the idea
I have my login table in mysql is like this
id
fname
lname
email
contactno
userid
password
acctype
status
Now my form is like this
<form name="frm" method="post" action="registerform.php">
<table id="new-account" class="create-an-account" width="100%" border="1" cellspacing="10px" cellpadding="10px">
<tr>
<td width="45%">
<label for="firstname">First Name</label>
<input type="text" style="width:230px;" name="Firstname" id="Firstname" /></td>
<td width="10%"></td>
<td width="45%">
<label for="lastname">Last Name:</label>
<input type="text" style="width:230px;" name="LastName" id="LastName" />
</td>
</tr>
<tr>
<td>
<label for="">Account Type</label>
<select class="select" name="at" id="ValidSelection" style="width:245px;" >
<option value="0">Select Account Type</option>
<option value="agent">agent</option>
<option value="admin">admin</option>
</select>
</td>
</tr>
<tr>
<td><label for="">Email Id:</label></td>
</tr>
<tr>
<td><input type="text" name="email" id="ValidEmail" style="width:230px;"/></td>
</tr>
<tr>
<td><label for="">Contact Number</label></td>
</tr>
<tr>
<td><input type="text" name="contact" id="ValidNumber" style="width:230px" /></td>
</tr>
<tr>
<td><label for=""><strong>Choose Your Login Id:</strong></label>
<input type="text" style="width:230px;" name="LoginId" id="LoginId"/>
</td>
</tr>
<tr>
<td><label for=""><strong>Password: <br /></strong></label></td>
</tr>
<tr>
<td><input type="password" style="width:230px;" name="Password" id="ValidPassword" /></td>
</tr>
<tr>
<td><label for="">Confirm Password:</label></td>
</tr>
<tr>
<td>
<input type="password" style="width:230px;" name="ConfirmPassword" id="ValidConfirmPassword"
/>
</td>
</tr>
<tr>
<td colspan="2"><input type="submit" name="signup" value="Create Account" style="margin-top:20px" /></td>
</tr>
</table>
and for insert data my php code is like this
<?php
if(isset($_REQUEST['signup'])) {
mysql_query("insert into login (`fname`,`lname`,`email`,`contactno`,`userid`,`password`,`acctype`,`status`) values('".$_REQUEST['Firstname']."','".$_REQUEST['LastName']."','".$_REQUEST['email']."','".$_REQUEST['contact']."','".$_REQUEST['LoginId']."','".$pswd."','".$_REQUEST['at']."','active')");
}
?>
Now here when I am reloading the page it is automatically inserting the last entered values to the database. So here can someone kindly tell me what is the issue here? Any help and suggestions are welcome.
If you reload the page after submitting a form, it will keep the POST data. To solve this follow the below things :
You can redirect to some other page after inserting the data, use header("location:new_page.php")
You can unset REQUEST, use unset($_REQUEST) after insert
after inserting the $_POST data use redirect to avoid this situation .
even you can redirect to same page like this :-
header('Location: '.$_SERVER['PHP_SELF']);
exit;
My users can enter more than one address but I want an actual button that generates the extra fields as only one address is compulsory and empty fields will look ugly! I also need the extra addresses to go into mysql database.
How would I do with Javascript if PHP is not possible
Some code that may help:
<td width="732" valign="top"><p>
<h3 class="main">Address Details</h3>
<p class="normal"> You are able to add up to 3 addresses but only 1 is compulsory.
However it would be helpful if you could insert 3 addresses:
<ul>
<li>Permanent home address</li>
<li>Postal address (where you will be from June to September)</li>
<li>Local address (where you currently live)</li>
</ul>
<?php
if(!empty($err)) {
echo "<div class=\"msg\">";
foreach ($err as $e) {
echo "* $e <br>";
}
echo "</div>";
}
?>
<br>
<form action="address.php" method="post" name="regForm" id="regForm" >
<table width="95%" border="0" cellpadding="3" cellspacing="3" class="forms">
<tr>
<td>Street<span class="required"><font color="#CC0000">*</font></span>
</td>
<td><input name="Street" type="text" id="Street" class="required" size="50">
</tr>
<tr>
<td>Line 2
</td>
<td><input name="Line2" type="text" id="Line2" class="required" size="50">
</tr>
<tr>
<td>Line 3
</td>
<td><input name="Line3" type="text" id="Line3" class="required" size="50">
</tr>
<tr>
<td>Town<span class="required"><font color="#CC0000">*</font></span>
</td>
<td><input name="Town" type="text" id="Town" class="required" size="30">
</tr>
<tr>
<td>Postcode<span class="required"><font color="#CC0000">*</font></span>
</td>
<td><input name="Postcode" type="text" id="Postcode" class="required" size="10">
</tr>
<tr>
<td>Country <font color="#CC0000">*</font></span></td>
<td><select name="Country" class="required" id="select8">
<option value="" selected></option>
<option value="Afghanistan">Afghanistan</option>
<option value="Albania">Albania</option>
(etc)
</select></td>
</tr>
<tr>
<td>Telephone Number<span class="required"><font color="#CC0000">*</font></span>
</td>
<td><input name="Tele" type="text" id="Tele" class="required" >
</tr>
<tr>
<td>Fax<span class="required"><font color="#CC0000">*</font></span>
</td>
<td><input name="Fax" type="text" id="Fax" class="required" >
</tr>
<tr>
<td>Mobile<span class="required"><font color="#CC0000">*</font></span>
</td>
<td><input name="Mobile" type="text" id="Mobile" class="required" >
</tr>
<tr>
<td>Type <font color="#CC0000">*</font></span></td>
<td><select name="Type" class="required" id="select8">
<option value="" selected></option>
<option value="H">Home</option>
<option value="P">Postal</option>
<option value="L">Local</option>
</table>
<p align="center">
<input name="doAddress" type="submit" id="doAddress" value="Submit">
to fix your parse error - put ; at the end of line $numrows = 0 + $_GET['numrows']
to generate more fields dynamically - use javascript, really, it's way better for this task than php
Clicking on the “Apply for Finance” button on our Vehicle Details page opens up a FancyZoom window on our website, with financeapp.js the file that is shown in the window. I need to pass some variables (Year, Make and Model of Car) to this page so that they are displayed in the Finance App window that pops up over the Vehicle Details page.
The Car Detail page has code like:
<?php echo $product_array['make']; ?>
To show the Vehicle Make on the page, and on the FancyZoom window, I also want to have the vehicle make echoed. Is this possible with Javascript? Can it be so that when the Javascript window is opened, it gets the vehicle info from detail page?
Putting in PHP Code into the .js file is resulting in Syntax errors.
This is the code for financeapp.js
$(document).ready(function(){
$('#content_outer').append('<div id="fancy_zoom_large_financeapp">\
<form action="" id="finance-app-form" method="POST">\
<H2>Apply for Finance</H2>\
<DIV id="mcms_contact">\
<FORM id="ContactForm" encType="multipart/form-data" method="post" name="form1" action="/financeinsurance.html">\
<INPUT type="hidden" name="type">\
<p>Mandatory fields are indicated with a *</p>\
<TABLE id="tablecontact">\
<TBODY>\
<TR>\
<TH width="146">First Name *</TH>\
<TD width="328"><INPUT id="firstname" size="50" name="firstname" AUTOCOMPLETE="OFF"></TD>\
<TD width="311"> </TD>\
</TR>\
<TR>\
<TH>Surname *</TH>\
<TD><INPUT id="surname" size="50" name="surname" AUTOCOMPLETE="OFF"></TD>\
<TD> </TD>\
</TR>\
<TR>\
<TH>Mobile *</TH>\
<TD><INPUT id="mobile" size="50" name="mobile"></TD>\
<TH rowspan="3">You are applying for finance for<br>the following vehicle: <br><img src ="images/car.jpg"><br>YEAR MAKE MODEL OF CAR<br>(Stock #STOCKNUMBER)</TH>\
</TR>\
<TR>\
<TH>Postcode *</TH>\
<TD><INPUT id="postcode" size="50" name="postcode" AUTOCOMPLETE="OFF"></TD> \
</TR>\
<TR>\
<TH>Email *</TH>\
<TD><INPUT id="email_address" size="50" name="email_address" AUTOCOMPLETE="OFF"></TD> \
</TR>\
<TR>\
<TH>Living Arrangement *</TH>\
<TD><SELECT id="living" name="living">\
<OPTION selected value="">Please select</OPTION>\
<OPTION value="Own">Own</OPTION>\
<OPTION value="Buy">Buy</OPTION>\
<OPTION value="Other (employer subsided)">Other (employer subsided)</OPTION>\
</SELECT></TD>\
<TD rowspan="5"></td>\
</TR>\
<TR>\
<TH>Employment Status *</TH>\
<TD><SELECT id="emp" name="emp">\
<OPTION selected value="">Please select</OPTION>\
<OPTION value="Full Time Permanent more than 3 months">Full Time Permanent more than 3 months</OPTION>\
<OPTION value="Part Time">Part Time</OPTION>\
<OPTION value="Pensioner">Pensioner</OPTION>\
<OPTION value="Unemployed">Unemployed</OPTION>\
</SELECT></TD> \
</TR>\
<TR>\
<TH>Credit Rating *</TH>\
<TD><SELECT id="credit" name="credit">\
<OPTION selected value="">Please select</OPTION>\
<OPTION value="Excellent - No Recorded Defaults">Excellent - No Recorded Defaults</OPTION>\
<OPTION value="Unsure">Unsure</OPTION>\
</SELECT></TD> \
</TR>\
<TR>\
<TH>Preferred Dealership *</TH>\
<TD><SELECT id="purchfrom" name="purchfrom">\
<OPTION selected value="">Please select</OPTION>\
<OPTION value="North">Northern Dealership</OPTION>\
<OPTION value="South">Southern Dealership</OPTION>\
</SELECT></TD> \
</TR>\
<TR>\
<TH>Purchase Price *</TH>\
<TD><INPUT id="price" size="50" name="price"></TD> \
</TR>\
<TR>\
<TH>Deposit/Trade In *</TH>\
<TD><INPUT id="dep" size="50" name="dep"></TD>\
<TD> </TD>\
</TR>\
<TR>\
<TH>Loan Amount *</TH>\
<TD><INPUT id="amt" size="50" name="amt"></TD>\
<TD> </TD>\
</TR>\
<TR>\
<TH></TH>\
<TD><INPUT value="Submit" type="submit" name="finance"></TD>\
<TD> </TD> \
</TR>\
</TBODY>\
</TABLE> \
</FORM>\
</DIV>');
$('.fancyzoom').fancyZoom();
});
Where YEAR MAKE and MODEL are in the code is where I want to insert to PHP Array [make], [model] etc. Doable....?
The simplest way to do this would be to load the contents of the element via ajax. For example (in jQuery):
$('#content_outer').load('ajax/car_data.php');
Here ajax/cardata.php would have code like:
<div id="fancy_zoom_large_financeapp">
<form action="" id="finance-app-form" method="POST">
<H2>Apply for Finance</H2>
etc.
<?=$year_of_car?>
Alternatively, you could send an AJAX query for just the year/make/model of the car.