I am developing a website using CI, PHP, JQuery. I have a dropdown menu. When I try to get the value using JQuery, the result always 0. Here is my code.
html:
<div id="label"><label>Merk</label></div><div id="pilihan"><select name="brand">
<option value="0">PILIH SATU</option>
<option value="1">ACURA</option>
<option value="2">ALFA ROMEO</option>
<option value="3">ASTON MARTIN</option>
<option value="4">AUDI</option>
<option value="5">BENTLEY</option>
<option value="6">BERTONE</option>
<option value="7">BIMANTARA</option>
<option value="8">BMW</option>
<option value="9">BUGATTI</option>
<option value="10">BUICK</option>
<option value="11">CADILLAC</option>
<option value="12">CHANA</option>
<option value="13">CHERY</option>
<option value="14">CHEVROLET</option>
<option value="15">CHRYSLER</option>
<option value="17">CITROEN</option>
<option value="18">CODA</option>
<option value="19">DAEWOO</option>
<option value="20">DAIHATSU</option>
<option value="21">DAIMLER</option>
<option value="22">DATSUN</option>
<option value="23">DODGE</option>
<option value="24">DYNA</option>
<option value="25">FERRARI</option>
<option value="26">FIAT</option>
<option value="27">FORD</option>
<option value="28">FOTON</option>
<option value="29">GREELY</option>
<option value="30">GMC</option>
<option value="31">GREAT WALL</option>
<option value="32">HAGLER</option>
<option value="33">HINO</option>
<option value="34">HOLDEN</option>
<option value="35">HONDA</option>
<option value="36">HUMMER</option>
<option value="37">HYUNDAI</option>
<option value="38">INFINITI</option>
<option value="39">ISUZU</option>
<option value="40">JAGUAR</option>
<option value="41">JEEP</option>
<option value="42">KIA</option>
<option value="43">KTM</option>
<option value="44">LAMBORGHINI</option>
<option value="45">LAND ROVER</option>
<option value="46">LEXUS</option>
<option value="47">LIGIER</option>
<option value="48">LOTUS</option>
<option value="49">MASERATI</option>
<option value="50">MAYBACH</option>
<option value="51">MAZDA</option>
<option value="52">MCLAREN</option>
<option value="53">MERCEDES-BEN</option>
<option value="54">MINI</option>
<option value="55">MITSUBISHI</option>
<option value="56">MORGAN</option>
<option value="57">NISSAN</option>
<option value="58">OPEL</option>
<option value="59">PEUGEOT</option>
<option value="60">PORSCHE</option>
<option value="61">PROTON</option>
<option value="62">RANGE ROVER</option>
<option value="63">RENAULT</option>
<option value="64">ROLLS-ROYCE</option>
<option value="65">SAAB</option>
<option value="66">SKODA</option>
<option value="67">SMART</option>
<option value="68">SSANGYONG</option>
<option value="69">SUBARU</option>
<option value="70">SUNBEAM</option>
<option value="71">SUZUKI</option>
<option value="72">TATA</option>
<option value="73">TIMOR</option>
<option value="74">TOYOTA</option>
<option value="75">TRIUMPH</option>
<option value="76">VAUXHALL</option>
<option value="77">VOLKSWAGEN</option>
<option value="78">VOLVO</option>
<option value="79">WRANGLER</option>
</select></div>
JQuery:
$('select[name="brand"]').change(function(){
var brand = $("select[name='brand']").val();
alert(brand);
$.ajax({
type: "POST",
url: '<?php echo site_url("ajax_data/getmodel"); ?>',
dataType: 'json',
data: { vehicle_class : '', vehicle_brand : brand },
success: function(data) {
// Clear all options from vehicle class select
$('select[name="model"] option').remove();
// Fill vehicle class select
$.each(data, function(i, j){
var row = "<option value=\"" + j.model_id + "\">" + j.model_name + "</option>";
$(row).appendTo('select[name="model"]');
});
}
});
});
What is wrong with my code actually? Thank you.
I've just put your code in to a text file (named test.html)...
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
<div id="label"><label>Merk</label></div><div id="pilihan"><select name="brand">
<option value="0">PILIH SATU</option>
<option value="1">ACURA</option>
<option value="2">ALFA ROMEO</option>
<option value="3">ASTON MARTIN</option>
: : :
<option value="77">VOLKSWAGEN</option>
<option value="78">VOLVO</option>
<option value="79">WRANGLER</option>
<script type="text/javascript">
$('select[name="brand"]').change(function(){
var brand = $("select[name='brand']").val();
alert( brand );
});
</script>
</body>
</html>
And the code works, perfectly in FireFox, Chrome and IE8.
Also, my mate says salam sejahtera. :o)
You're selecting with select[name=brand], which means you're trying to access
<select value="THIS_IS_WHAT_YOU_ARE_SELECTING">
but you want the selected option, so use
$('select[name=brand] option:selected').val();
Related
i'm unable for success in how to show gender and state from below coading
please solve this.
$gender = $html->getElementById("cpBody_rbtnListGender")->getAttribute("value");
$state = $html->getElementById("cpBody_ddlState")->getAttribute("value");
this is for gender
<span id="cpBody_rbtnListGender" class="form-control pull-left radio-input"><input id="cpBody_rbtnListGender_0" type="radio" name="ctl00$cpBody$rbtnListGender" value="MALE" checked="checked" tabindex="3"><label for="cpBody_rbtnListGender_0">Male</label><input id="cpBody_rbtnListGender_1" type="radio" name="ctl00$cpBody$rbtnListGender" value="FEMALE" tabindex="3"><label for="cpBody_rbtnListGender_1">Female</label><input id="cpBody_rbtnListGender_2" type="radio" name="ctl00$cpBody$rbtnListGender" value="TRANSGENDER" tabindex="3"><label for="cpBody_rbtnListGender_2">Transgender</label><input id="cpBody_rbtnListGender_3" type="radio" name="ctl00$cpBody$rbtnListGender" value="OTHER" tabindex="3"><label for="cpBody_rbtnListGender_3">Other</label></span>
and this is for state
<div class="input-group">
<label class="control-label label-fixed">State</label>
<select name="ctl00$cpBody$ddlState" id="cpBody_ddlState" tabindex="15" class="form-control">
<option value="0">--SELECT STATE--</option>
<option value="1">ANDAMAN & NICOBAR ISLANDS</option>
<option value="2">ANDHRA PRADESH</option>
<option value="3">ARUNACHAL PRADESH</option>
<option value="4">ASSAM</option>
<option value="5">BIHAR</option>
<option value="6">CHANDIGARH</option>
<option value="7">CHHATTISGARH</option>
<option value="8">DADRA & NAGAR HAVELI</option>
<option value="9">DAMAN & DIU</option>
<option value="10">DELHI</option>
<option value="11">GOA</option>
<option value="12">GUJARAT</option>
<option value="13">HARYANA</option>
<option value="14">HIMACHAL PRADESH</option>
<option value="15">JAMMU AND KASHMIR</option>
<option value="16">JHARKHAND</option>
<option value="17">KARNATAKA</option>
<option value="18">KERALA</option>
<option value="19">LAKSHADWEEP</option>
<option value="20">MADHYA PRADESH</option>
<option value="21">MAHARASHTRA</option>
<option value="22">MANIPUR</option>
<option value="23">MEGHALAYA</option>
<option value="24">MIZORAM</option>
<option value="25">NAGALAND</option>
<option value="26">ORISSA</option>
<option value="27">PONDICHERRY</option>
<option value="28">PUNJAB</option>
<option selected="selected" value="29">RAJASTHAN</option>
<option value="30">SIKKIM</option>
<option value="31">TAMIL NADU</option>
<option value="32">TELANGANA</option>
<option value="33">TRIPURA</option>
<option value="34">UTTAR PRADESH</option>
<option value="35">UTTARAKHAND</option>
<option value="36">WEST BENGAL</option>
</select>
</div>
state and gender is not showing using getAttribute("value");
You could make use of find.
One option to get the state could be to use the id and get the selected option #cpBody_ddlState option[selected]
$state = $html->find('#cpBody_ddlState option[selected]', 0)->plaintext;
echo $state; //RAJASTHAN
To get the selected radio button you might use #cpBody_rbtnListGender input and loop though the items until the attribute checked matches:
foreach ($html->find('#cpBody_rbtnListGender input') as $input) {
if ($input->hasAttribute("checked")) {
echo $input->getAttribute("value"); // MALE
}
}
idk why you're doing this with php.'
in javascript u can create a p to pass the value to it:
<body onload="pageloaded()">
<p id="display"></p>
in javascript:
var p = document.getElementById("display");
var value = document.getElementById("cpBody_rbtnListGender").value;
function pageloaded(){
p.innerHTML = value;
}
u can do the same for ur other needs
code:
<script>
$(document).ready(function(){
$(".field").change(function(){
field = $(".field").val();
$.ajax({
type:"POST",
data:{"field":field},
url:"potential-courses.php",
success:function(data){
$(".course").val(data);
}
});
});
});
</script>
potential-courses.php
<?php
include("conn.php");
$field = $_POST['field'];
$sql = "select * from course_master where field = '$field' order by course_full_name";
$result = mysqli_query($link,$sql);
while ($row = mysqli_fetch_array($result))
{
echo "<option value=".$row['course_short_name'].">".$row['course_full_name']."</option>";
}
?>
html code:
<select name='field' class='field' id="field">
<option value="">Select Field</option>
<option value='engineering'>Engineering</option>
<option value='law'>LAW</option>
<option value='medical'>Medical</option>
<option value='management'>Management</option>
<option value='pharmacy'>Pharmacy</option>
<option value='hotel management'>Hotel Management</option>
<option value='mass communication'>Mass Communication</option>
<option value='agriculture'>Agriculture</option>
<option value='architecture'>Architecture</option>
<option value='education'>Education</option>
<option value='paramedical'>Paramedical</option>
<option value='design'>Design</option>
<option value='commerce'>Commerce</option>
<option value='film/tV/media'>Film /TV/ Media</option>
</select>
<select name="course" class="course">
<option value="">Select Courses</option>
</select>
In this code I have two dropdown list i.e
<select name='field' class='field' id="field">
and another is
<select name="course" class="course">
when I change value from "name=field" it display nothing in "name=course". where I am doing wrong please help me.
Thank You
Change it:
$(".course").val(data);
to
$(".course").html(data);
It will add the <option> set that you have returned from php to your <select>
I have setup a function with jQuery that hides and un-hides related select's after a has changed the first one. The problem is that if a user chooses one value and then changes it to another value in a different relates select then the first one he chose stays selected and they both get submitted with the form.
How can I reset the hidden select values if the user changes his mind?
Here's my code:
/*Setup jQuery Function to hide/unhide selects */
<script>
$(document).ready(function(){
var $topSelect = $('select[name="dropdownmain"]');
var $nestedSelects = $('select[name!="dropdownmain"]');
showApplicableSelect();
$topSelect.change(showApplicableSelect);
function showApplicableSelect() {
$nestedSelects.hide();
$('select[name="' + $topSelect.val() + '"]').show();
}
});
</script>
/* Example of the select items and how they are related */
<select class=" form-textbox validate[required]" onChange="change()" name="dropdownmain" id="" title=""> <option selected="selected" value="PLEASE SELECT">PLEASE SELECT</option>
<option value="1">Accommodation and Food Services</option>
<option value="2">Administrative / Support / Waste Management / Remediation Services</option>
<option value="3">Agriculture / Forestry / Fishing / Hunting</option>
<option value="4">Arts / Entertainment / Recreation</option>
<option value="5">Automotive</option>
<option value="6">Construction</option>
<option value="7">Educational Services</option>
<option value="8">Finance and Insurance</option>
<option value="9">Health Care and Social Assistance</option>
<option value="10">Information</option>
<option value="11">Manufacturing</option>
<option value="12">Other</option>
<option value="13">Other Services</option>
<option value="14">Professional / Scientific and Technical Services</option>
<option value="15">Real Estate and Rental and Leasing</option>
<option value="16">Retail Trade</option>
<option value="17">Transportation and Warehousing</option>
</select>
<select class=" form-textbox validate[required]" name="PLEASE SELECT" id="2" title=""> <option value=""> </option> </select>
<select class=' form-textbox validate[required]' name='1' id='' title=''> <option selected='selected' value='PLEASE SELECT'>PLEASE SELECT</option>
<option value='1'>Bakery / Cafes</option>
<option value='2'>Bed and Breakfast Inns</option>
<option value='3'>Carryout restaurants</option>
<option value='4'>Casual Dining Restaurant $$-</option>
<option value='5'>Coffee Shop</option>
<option value='6'>Drinking Places (Alcoholic Beverages)</option>
<option value='7'>Fast-food Restaurants</option>
<option value='8'>Fine Dining Restaurant $$$+</option>
<option value='9'>Full Service Restaurant</option>
<option value='10'>Hotels and Motels</option>
<option value='11'>Other food related services</option>
<option value='12'>Travel Agencies</option>
<option value='27'>Other</option>
</select>
Use jQuery to
reset selected property and
force value to initial value
Code:
$nestedSelects
.prop("selected", false)
.val("-1") // or .val("PLEASE SELECT")
.hide();
I have updated your HTML dropdown initial value from "PLEASE SELECT" to -1.
<option selected='selected' value='-1'>PLEASE SELECT</option>
jsfiddle
Tested form in w3schools :)
I have select box with multiple option in my project. The code is below
<select name='sendto[]' id='sendto' multiple required>
<option value='branchstaff'>Branch Staff</option>
<option value='manager'>Manager</option>
<option value='cashier'>Cashier</option>
<option value='hostaff'>Head Office Staff</option>
<option value='all'>All of Above</option>
</select>
I am using jQuery in this project. Now I want to select some values to send message. How can I deselect all other values when I click All of Above
This is how I would do it:
$("option").click(function () {
if ($(this).text() == "All of Above") {
$(this).siblings().removeAttr("selected");
}
});
Here is the JSFiddle demo
$('#sendto').change(function() {
alert($('option:selected', this).val())
if ($('option:selected', this).val() === 'all') {
$("select[multiple] option").prop("selected", "selected");
}
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select name='sendto[]' id='sendto' multiple required>
<option value='branchstaff'>Branch Staff</option>
<option value='manager'>Manager</option>
<option value='cashier'>Cashier</option>
<option value='hostaff'>Head Office Staff</option>
<option value='all'>All of Above</option>
</select>
$('#sendto').change(function () {
if ($('option:selected', this).val() == 'all') {
$("select[multiple] option").prop("selected", "selected");
}
})
<select name='sendto[]' id='sendto' multiple required>
<option value='branchstaff'>Branch Staff</option>
<option value='manager'>Manager</option>
<option value='cashier'>Cashier</option>
<option value='hostaff'>Head Office Staff</option>
<option value='all'>All of Above</option>
</select>
Try this
try below
$('#sendto option[value="all"]').on('click',function(){
$('#sendto').find('option').attr('selected','selected');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name='sendto[]' id='sendto' multiple required>
<option value='branchstaff'>Branch Staff</option>
<option value='manager'>Manager</option>
<option value='cashier'>Cashier</option>
<option value='hostaff'>Head Office Staff</option>
<option value='all'>All of Above</option>
</select>
$('option[value="all"]').on('click',function(){
$(this).parent().find('option').attr('selected','selected');
$(this).removeAttr('selected');
});
This question already has answers here:
How to fix "Headers already sent" error in PHP
(11 answers)
Closed 9 years ago.
I'm doing a project for my school and I wrote this page but for some reason I get 2 warnings in the end about header info already sent on line 132 but on line 132 all I have is the php tag
I would really appreciate it if I can get some help, I wrote this code in 1 hour but trying to solve this problem for the past 2 hours ...
Finally got tired and decided to ask it
here is my code
<html>
<body>
<form method="POST">
Browse By Author's name starting with :<select name="author">
<option value="">--Select--</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
<option value="E">E</option>
<option value="F">F</option>
<option value="G">G</option>
<option value="H">H</option>
<option value="I">I</option>
<option value="J">J</option>
<option value="K">K</option>
<option value="L">L</option>
<option value="M">M</option>
<option value="N">N</option>
<option value="O">O</option>
<option value="P">P</option>
<option value="Q">Q</option>
<option value="R">R</option>
<option value="S">S</option>
<option value="T">T</option>
<option value="U">U</option>
<option value="V">V</option>
<option value="W">W</option>
<option value="X">X</option>
<option value="Y">Y</option>
<option value="Z">Z</option>
</select><br><br>
Browse by Title start with :<select name="title">
<option value="">--Select--</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
<option value="E">E</option>
<option value="F">F</option>
<option value="G">G</option>
<option value="H">H</option>
<option value="I">I</option>
<option value="J">J</option>
<option value="K">K</option>
<option value="L">L</option>
<option value="M">M</option>
<option value="N">N</option>
<option value="O">O</option>
<option value="P">P</option>
<option value="Q">Q</option>
<option value="R">R</option>
<option value="S">S</option>
<option value="T">T</option>
<option value="U">U</option>
<option value="V">V</option>
<option value="W">W</option>
<option value="X">X</option>
<option value="Y">Y</option>
<option value="Z">Z</option>
</select><br><br>
Browse by Publisher start with :<select name="publisher">
<option value="">--Select--</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
<option value="E">E</option>
<option value="F">F</option>
<option value="G">G</option>
<option value="H">H</option>
<option value="I">I</option>
<option value="J">J</option>
<option value="K">K</option>
<option value="L">L</option>
<option value="M">M</option>
<option value="N">N</option>
<option value="O">O</option>
<option value="P">P</option>
<option value="Q">Q</option>
<option value="R">R</option>
<option value="S">S</option>
<option value="T">T</option>
<option value="U">U</option>
<option value="V">V</option>
<option value="W">W</option>
<option value="X">X</option>
<option value="Y">Y</option>
<option value="Z">Z</option>
</select><br><br>
Browse by Genre:<select name="genre">
<option value="">--Select--</option>
<option value="fiction">Fiction</option>
<option value="non-fiction">non-fiction</option>
<option value="sciencefiction">science fiction</option>
</select><br><br>
Book Award: <select name="bookaward">
<option value="">--Select--</option>
<option value="1">Arthur Ellis Award</option>
<option value="2">Booker Prize</option>
<option value="3">Canadian Jewish Book Awards</option>
<option value="4">Commonwealth Writers Prize</option>
<option value="5">Dayne Ogilvie Prize</option>
<option value="6">Edna Staebler Award</option>
<option value="7">Geoffrey Bilson Award</option>
<option value="8">Gerald Lampert Award</option>
<option value="9">Griffin Poetry Prize</option>
<option value="10">Governor General's Award</option>
<option value="11">Commonwealth Writers Prize</option>
<option value="12">Journey Prize</option>
<option value="13">Lorne Pierce Medal</option>
<option value="14">Wright Awards</option>
<option value="15">Milton Acorn People's Poetry Award</option>
<option value="16">Matt Cohen Award: In Celebration of a Writing Life</option>
<option value="17">Norma Fleck Award</option>
<option value="18">RBC Bronwen Wallace Award for Emerging Writers</option>
<option value="19">Pat Lowther Award</option>
<option value="20">Rogers Writers' Trust Fiction Prize</option>
<option value="21"> Wright Awards</option>
<option value="22">Writers' Trust Distinguished Contribution Award</option>
<option value="23">Writers' Trust Engel/Findley Award</option>
<option value="24">Winterset Award</option>
<option value="25">Hilary Weston Writers' Trust Prize for Nonfiction</option>
<option value="26">Geoffrey Bilson Award</option>
</select><br><br>
<input type="submit" name="submit" value="Browse">
</form>
<?php
error_reporting(E_ERROR|E_WARNING);
$con = mysql_connect("localhost", "root", "");
if (!$con) {
die('Connection Failed: ' . mysql_error());
}
if (mysql_select_db("elibrary",$con)){
if ($_POST['submit']){
$author = $_POST['author'];
$title = $_POST['title'];
$genre = $_POST['genre'];
$publisher= $_POST['publisher'];
$award= $_POST['bookaward'];
if ($author != "") {
$author1 = "author";
$like1 = "like";
$and1 = "and";
}
if ($title != "") {
$title1= "title";
$like2 = "like";
$and2 = "and";
}
if ($genre != "") {
$genre1="genre";
$like3 = "like";
$and3 = "and";
}
if ($publisher != "") {
$publisher1= "publisher";
$like4 = "like";
$and4 = "and";
}
if ($award != "") {
$award1= "bookawards.id";
$like5 = "=";
$and5 = "and";
}
$browse = ("select * from books,bookawards,bookrelations where books.id = bookrelations.bookid and bookawards.id = bookrelations.bookawardsid '".$and1."' '".$author1."' '".$like1."' '".$author."%' '".$and2."' '".$title1."' '".$like2."' '".$title."%' '".$and3."' '".$genre1."' '".$like3."' '".$genre."%' '".$and4."' '".$publisher1."' '".$like4."' '".$publisher."' '".$and5."' '".$award1."''".$like5."''".$award."'");
setcookie("browse",$browse);
header("Location: shop.php");
exit();
}
}
mysql_close();
?>
</body>
</html>
You need to move your PHP code to top of the page (before HTML).
For more detailed answer:
https://stackoverflow.com/a/8028987/1724762
header() will not work after you have already output so much HTML. It has to be called before any output is sent to browser
According to PHP Manual
Remember that header() must be called before any actual output is sent, either by normal HTML tags, blank lines in a file, or from PHP. It is a very common error to read code with include, or require, functions, or another file access function, and have spaces or empty lines that are output before header() is called. The same problem exists when using a single PHP/HTML file.
When you write to the output with echo or any function, PHP has already sent the response body.
Which means that you cannot send headers after.
The same apply for html, the html will be displayed and the output has already started so you cannot call header() after.
The same also apply to closing tags ?>. If you have any single space after the closing tag, it will be ignored by the parser (because outside of the closing tag) and the output will start.
So the best solution is to ommit the closing tags, because the parser doesn't need them.
It's like if you were sending an email and add the address after.