I have a problem with my code, when i clicked option and refresh browser will give back to default option
html
<select id="harga">
<option value="renceng" isi="10" selected>Renceng</option>
<option value="pack" isi="40">Pack</option>
<option value="dus" isi="800">Dus</option>
</select>
<input id="hasil" type="text" name="harga" placeholder="isi" value="10" readonly>
js
$("#harga").on("change", function(){
var nilai = $("#harga :selected").attr("isi");
$("#hasil").val(nilai);
});
Related
Hello just want to ask what is the proper way to pass a parameter using jquery my parameter is from a html input , below is my code.
function ajax_post(){
var param = document.getElementById('def').value;
$('#chatlogs').load('main.php?id='+param);
}
I'm able to load the main.php but cannot get to echo the param, here is my main.php code.
<?php echo $_GET['id'];?>
Adding more details.. im getting the parameters from a HTML select input then after getting the value, will then load the main.php into a div with a id of #chatlogs.
<select name="topic" id="def" class="form-control" style="width:450px;" onChange='ajax_post()'>
<option value="" selected>---</option>
<option value="Solder Short">Solder Short</option>
<option value="Insufficient Solder">Insufficient Solder</option>
<option value="Misaligned Component">Misaligned Component</option>
<option value="Missing Component">Missing Component</option>
<option value="Inverted Component">Inverted Component</option>
<option value="Pad Contamination">Pad Contamination</option>
</select>
<div id="chatlogs">
Please select a defect category...
</div>
Try this:
<select name="topic" id="def" class="form-control" style="width:450px;">
<option value="" selected>---</option>
<option value="Solder Short">Solder Short</option>
<option value="Insufficient Solder">Insufficient Solder</option>
<option value="Misaligned Component">Misaligned Component</option>
<option value="Missing Component">Missing Component</option>
<option value="Inverted Component">Inverted Component</option>
<option value="Pad Contamination">Pad Contamination</option>
</select>
<div id="chatlogs">
Please select a defect category...
</div>
<script>
$(document).ready(function(){
$('#def').on('change', function() {
var param = document.getElementById('def').value;
//alert(param);
$('#chatlogs').load('main.php?id=', param);
})
});
</script>
Try this one:
function ajax_post(){
var param = document.getElementById('def').value;
$('#chatlogs').load('main.php?id='+param);
}
I am using the popSelect jquery plugin (http://jquer.in/popSelect/)
This is the code I use :
<select name="tun" id="tun" class="form-control">
<option value='op1'>op1</option>
<option value='op2'>op2</option>
<option value='op3'>op3</option>
<option value='op4'>op4</option>
</select>
And this is the javascript code to run the plugin
$('#tun').popSelect({
placeholderText: 'tun',
showTitle: false ,
autoIncrease: true
});
I want to get the selected items once the form is submitted (post). I tried this but I got an empty array.
$tun=$_POST['tun']
In the documentation they said that this code allow to returns the current selected values.
$(elem).popSelect('value')
This is with javascript, but I want these elements in my PHP code.
Can someone help me ?.
Let assume you have the following form:
<form action="welcome.php" method="post">
Name: <input type="text" name="name"><br>
E-mail: <input type="text" name="email"><br>
Select a color:
<select id="myselect" name="colors[]" multiple>
<option value="green">Green</option>
<option value="red">Red</option>
<option value="blue">Blue</option>
<option value="violet">Violet</option>
<option value="orange">Orange</option>
<option value="white" selected="selected">White</option>
</select>
<input type="submit">
</form>
And you have initialized the popSelect plugin in javascript as follows:
$(function() {
$("#myselect").popSelect({
showTitle: false,
maxAllowed: 4
});
});
Then, inside your welcome.php file you can fetch what the user has selected by accessing the $_POST array variable of the post request:
$colorsSelected = $_POST['colors'];
I want the user to be forced to select any option in the drop down apart from the default "selected" option
here is my drop down menu code;
<form><label>Select Tank:</label>
<select class="text2" name="tank" id="mySelect">
<option value="0" selected="selected">Select your tank</option>
<option value="4"> Tank#1 </option>
<option value="9"> Tank#2 </option>
<option value="21"> Tank#3 </option>
<option value="34"> Tank#4 </option>
</select>
<input type="button" id="btncheck" value="Submit"/>
</form>
and here is my java;
$('#btncheck').click(function(){
if ($("#mySelect ")[0].selectedIndex <= 0) {
alert("Please select a tank from the menu!");
return false;
}
});
jsfiddle: http://jsfiddle.net/36JZL/41/
for some reason it validates correctly but form isnt submitted.
You can do it with jQuery on client side but its not a good option to validate things on client side.
PasteBin: http://jsbin.com/zer/1
<form id="myForm">
<label>Select Tank:</label><br />
<select class="text" name="tank" id="tankSelector">
<option value="All" selected="selected"> Select Tank </option>
<?QUERY HERE TO PULL AND LOOP FROM DATABASE?>
<option value="<?php echo $row->id; ?>"> <?php echo $row->description; ?> </option>
<? END LOOP ?>
</select>
<input type="submit">
</form>
<script>
$(function() {
$('#myForm').submit(function(e){
if($('#tankSelector').val() == 'All') {
alert('Select tank!');
e.preventDefault();
}
});
});
</script>
<label>Select Tank:</label><br />
<select class="text" id="seltank" name="tank">
<option value="All" selected="selected"> Select Tank </option>
</select>
in the client side click event of your submit button add some javascript to check the value of your drop down.
if(document.getElementById("seltank").value == "All")
{
//put some code to alert the user or show error
return false; //this should prevent your post
}
Similar post is here How do I cancel form submission in submit button onclick event?
Here's what I do:
<select class="text2" name="tank" id="mySelect">
<option></option>
<option value="4"> Tank#1 </option>
<option value="9"> Tank#2 </option>
<option value="21"> Tank#3 </option>
<option value="34"> Tank#4 </option>
</select>
If the user hits submit without making a selection, they will be prompted to select an option automatically. The limitation is that you don't get a pretty little "select an option" placeholder.
Maybe this can help. Im yet to find a stable answer
If using php:
$val = $_POST['select_input']; <--- works fine
or
$val = $request->select_input <---- can be problematic
On Html
<select id="select_input" name="select_input" >
<option value="0">Pending</option>
<option value="1">Approved</option>
<option value="0" selected>Pending</option>
</select>
I have created a datalist here how can I add a link to option so that whenever i select a option and click on submit i should redirect to another page based on selected option.I have googled a lot but I couldn't any information about this.Thanks in advance
<input list="category" name="category">
<datalist id="category">
<option value="fruits">
<option value="animals">
<option value="vechiles">
<option value="ornaments">
</datalist>
<input type="submit">
You can try below code :
<input list="category" name="category" id="textcat">
<datalist id="category">
<option id="www.google.com" value="fruits">
<option id="www.fb.com" value="animals">
<option id="www.ymail.com" value="vechiles">
<option id="www.msn.com" value="ornaments">
</datalist>
<input id="btn" type="button" value="submit">
<script>
$('#btn').click(function(){
var textval = $('#textcat').val();
$('#category option').each(function(){
if($(this).val() == textval){
alert($(this).attr('id'));
window.location = $(this).attr('id');
}
});
});
</script>
Make some formHandler.php in which you will some routing, and point your form (action="formHandler.php") that includes this select
$redirectLink=$_REQUEST['category'];
header('Location:'.$yourmainSitePath.'/'.$redirectLink)
Are you satisfied ? :D
I am currently running JavaScript after a click of a button in my PHP page which saves data.
a.js:
function save(){
var oldItems = JSON.parse(localStorage.getItem('itemsArray')) || [];
var newItem = {};
var num = document.getElementById("num").value;
newItem[num] = {
"methv": document.getElementById("methv").value
,'q1': document.getElementById("q1").value,
'q2':document.getElementById("q2").value,
'q3':document.getElementById("q3").value,
'q4':document.getElementById("q4").value,
'comm':document.getElementById("comm").value
};
oldItems.push(newItem);
localStorage.setItem('itemsArray', JSON.stringify(oldItems));
$.post('edit.php', { items: JSON.stringify(oldItems) }, function(response) {
});
In the PHP page, my form looks like this:
edit.php
<form action="" method="post" enctype="multipart/form-data">
<select name="methv" class="textfields" id="methv" style="width:110px" >
<option value= "dont know">dont know </option>
<select name="q1" class="textfields" id="q1" style="width:50px" >
<option value= "-">-</option>
<option value= "L">L</option>
<select name="q2" class="textfields" id="q2" style="width:50px" >
<option value= "-">-</option>
<option value= "L">L</option>
<select name="q3" class="textfields" id="q3" style="width:50px" >
<option value= "-">-</option>
<option value= "L">L</option>
<select name="q4" class="textfields" id="q4" style="width:50px" >
<option value= "-">-</option>
<option value= "L">L</option>
<textarea rows="4" cols="40" id="comm" name="comm" style="width:300px"><?php echo $post['addcomment'] ;?></textarea>
</form>
When I run the PHP page and click the button, in the console, I get a post:
[{"1173627548":{"methv":"dont know","q1":"-","q2":"-","q3":"U","q4":"-","comm":""}},{"1173627548":{"methv":"dont know","q1":"-","q2":"-","q3":"U","q4":"-","comm":""}}]
These are the results from the local storage- one from before and one after it- being clicked (adds every time the button is clicked). How do I get this information and display it on the PHP page?
Do you already have an edit.php file to handle the POST request? This link might help you if not. http://edwin.baculsoft.com/2011/12/how-to-handle-json-post-request-using-php/
Once edit.php is set up to handle the request and return data, you'll probably want to manipulate that data within your response function.
$.post('edit.php', { items: JSON.stringify(oldItems) }, function(data) {
// Do something here, for example...
alert(data);
});
Hopefully this is what you're looking for.