I don't know what i'm doing wrong and im stuck in this part of my project so any help would be appreciated
here is my html:
<form id="form_search" method="post" action="/controler/something">
<select id="tip_fam" maxlength="100" >
<option value="1">something 001</option>
<option value="2">something 002</option>
<option value="3">something 003</option>
<ul id="print" class="bot"><li>Print</li></ul>
</form>
JS:
$("#print").click(function(){
url = base_url+"index.php/almacen/product/create_pdf/"+$("#tip_fam").val();
window.open(url,'',"width=800,height=600,menubars=no,resizable=no;")
});
Php (codeigniter) :
public function create_pdf(){
$tip_fam = $this->input->post('tip_fam');
i thought i could get the value of the select this way but when i print it in a var_dump(), it shows me "boolean false".
to send value in url and to use in controller, you should capture that vales in parameter of the function. Change your code like this, it will work.
public function create_pdf($tip_fam){
echo $tip_fam;// will echo the value which you passed from view.
You don't actually have to use javascript. I would do it this way.
EDIT: You can have more than one submit button. Just check it in your function.
View:
<form id="form_search" method="post" action="/controller/something">
<select id="tip_fam" maxlength="100">
<option value="1">something 001</option>
<option value="2">something 002</option>
<option value="3">something 003</option>
</select>
<input type="submit" name="print" id="print" value="Print">
<input type="submit" name="print" id="print" value="PrintAndSave">
</form>
Controller:
public function something()
{
// Check which button was clicked
$submit_button = $this->input->post('print');
if( $submit_button == 'print' )
{
// Do print
}
elseif( $submit_button == 'printAndSave' )
{
// Do print and save
}
}
Related
i want to have a button to submit a form, but it doesnt seem to work. when the button is clicked, nothing happens.
HTML
<form method="post" action="process.php">
<select name="taskOption" id="taskOption2">
<option value="Select">Please select a site</option>
<option value="http://www.Itslearning.com">Itslearning</option>
<option value="http://www.NDLA.no">NDLA</option>
</select>
</form>
<button onclick="FormSubmit()" class="button button1 button1:hover">Take me there</button>
JavaScript
function FormSubmit() {
document.getElementById("taskOption").submit();
}
PHP
<?php
$option = isset($_POST['taskOption2']) ? $_POST['taskOption2'] : false;
if ($option) {
header("Location: $option");
}
else {
echo "Venligst velg en side.";
exit;
}
?>
Your function is wrong.
document.getElementById("taskOption").submit();// this is wrong
taskOption it is the id of select box not your forms
<form name="F1">// give a name to your form
.....
</form>
function FormSubmit() {
document.F1.submit();
}
or
<form id="formid">// give a id to your form
.....
</form>
function FormSubmit() {
document.getElementById('formid').submit();
}
You must write id of Form, like instead of below:
<form method="post" action="process.php" id="taskOption2">
<select name="taskOption" >
<option value="Select">Please select a site</option>
<option value="http://www.Itslearning.com">Itslearning</option>
<option value="http://www.NDLA.no">NDLA</option>
</select>
</form>
Use:
Javascript:
function FormSubmit() {
document.taskform.submit();
}
HTML:
<form method="post" name="taskform" action="process.php">
<select name="taskOption" id="taskOption2">
<option value="Select">Please select a site</option>
<option value="http://www.Itslearning.com">Itslearning</option>
<option value="http://www.NDLA.no">NDLA</option>
</select>
</form>
<button onclick="FormSubmit()" class="button button1 button1:hover">Take me there</button>
first you gave a name to form here form1 is name
then onclick you call the form
<form method="post" name="form1" action="process.php">
<select name="taskOption" id="taskOption2">
<option value="Select">Please select a site</option>
<option value="http://www.Itslearning.com">Itslearning</option>
<option value="http://www.NDLA.no">NDLA</option>
</select>
</form>
<button onclick="FormSubmit()" class="button button1 button1:hover">Take me there</button>
function FormSubmit() {
document.form1.submit();
}
Seems to me you just want a submit button in a form:
In that case, by far the easiest solution is move the <button> to inside the form tags, and make its type="submit". There's no Javascript required at all:
<form method="post" action="process.php">
<select name="taskOption" id="taskOption2">
<option value="Select">Please select a site</option>
<option value="http://www.Itslearning.com">Itslearning</option>
<option value="http://www.NDLA.no">NDLA</option>
</select>
<button type="submit" class="button button1 button1:hover">Take me there</button>
</form>
Try this
function submitMyForm()
{
alert("Test");
document.getElementById("myForm").submit();
}
<form id="myform" method="post" action="process.php">
<select name="taskOption" id="taskOption2">
<option value="Select">Please select a site</option>
<option value="http://www.Itslearning.com">Itslearning</option>
<option value="http://www.NDLA.no">NDLA</option>
</select>
</form>
<button onclick="submitMyForm()">The time is?</button>
It will not work because you forgot to add the id in the form and you are calling submit function on a form with id taskOption.
<form method="post" action="process.php">
there is no id in the form tag, add the id as:
<form method="post" action="process.php" id="taskOption">
You have wrong call submit , only form id or element can use submit() . So call form element first
function FormSubmit() {
document.getElementById("taskOption2").parentNode.submit(); //must call id not name (parentNode is getting for parent form element)
}
In your php you have wrong access with select id ,the correct thing is access by element name
$option = isset($_POST['taskOption']) ? $_POST['taskOption'] : false; //element name is valid call
When I choice google the submit button value turn into google.com and I choice yahoo submit button value will be change. Here is my attempt.
<script>
function goToNewPage() {
if(document.getElementById('target').value){
window.open('url','_blank');
}
}
</script>
<form name="dropdown">
<select name="selected" id="target" accesskey="E">
<option selected>...Select...</option>
<option value="http://www.google.com">Google</option>
<option value="http://www.yahoo.com/">Yahoo</option>
</select>
<input type="button" value="Go" onclick="goToNewPage(document.dropdown.selected)">
</form>
You were VERY close.
This edited version fixes it. (fiddle)
HTML - Add value for nothing selected. Strip out the attempt at setting the URL on the way in. Added an ID for the button, to be used for new function.
<form name="dropdown">
<select name="selected" id="target" accesskey="E" onchange="changeText()">
<option value="nothing" selected>...Select...</option>
<option value="http://www.google.com">Google</option>
<option value="http://www.yahoo.com/">Yahoo</option>
</select>
<input type="button" value="Go" id="butGo" onclick="goToNewPage()">
</form>
JS - Set URL when the function is called. Don't put URL in quotes. It would think it's a string.
function goToNewPage() {
url = document.getElementById('target').value;
//alert(url)
if(document.getElementById('target').value!='nothing'){
window.open(url,'_blank');
}
}
If you want to change the TEXT on the button, do this:
function changeText(){
url = document.getElementById('target').value;
if (url=='http://www.google.com') {
document.getElementById('butGo').value = 'Google'
}
if (url=='http://www.yahoo.com/') {
document.getElementById('butGo').value = 'Yahoo'
}
}
I'm creating a pretty url base web and I have a problem with get variables in form.
I have a url like localhost/events/1 (1 is a get variable $_GET['eventID']).
I want to send the eventID with a form like below
<select name='eventID'>
<option value='1'>firstEvent</option>
<option value='2'>secondEvent</option>
<option value='3'>thirdEvent</option>
</select>
but when i click on submit button to send information into page and my url change to this
localhost/events/?eventID=1
but i want my url to be look like this
localhost/events/1
how could I achive to this?
If you want to do this at the client side, you can use the javascript onsubmit event and redirect to the page that you want. For example:
<script type="text/javascript">
function yourFunction()
{
var sel = document.getElementById('eventID');
if (sel.selectedIndex !== -1)
{
window.location.href = '/events/' + sel.options[sel.selectedIndex].value;
}
return false;
}
</script>
<form method="get" onsubmit="return yourFunction()">
<select name="eventID" id="eventID">
<option value="1">firstEvent</option>
<option value="2">secondEvent</option>
<option value="3">thirdEvent</option>
</select>
<input type="submit">
</form>
According to W3C The question mark is part of the definition of form submission with the GET method, so you can't actually do this. but you can redirect the page with javascript.
<form id="form" method="get">
<select name='eventID'>
<option value='1'>firstEvent</option>
<option value='2'>secondEvent</option>
<option value='3'>thirdEvent</option>
</select>
<input type="button" onclick="document.location.href= '/events/' + form.eventID.value" value="Submit">
</form>
thanks to all.
I want a solution without javascript or jquery
but it seems, there is no way to do this without them both.
I finally wrote some code in Jquery to solve this problem.
<form id="events" method="get">
<select name='eventID'>
<option value='1'>firstEvent</option>
<option value='2'>secondEvent</option>
<option value='3'>thirdEvent</option>
</select>
<input type="button" onclick="document.location.href= '/events/' + form.eventID.value" value="Submit">
</form>
$('#events').on('submit', function(e){
e.preventDefault();
document.location.href= '/events/' + $(this).find('select#sportID').val();
})
Need form to change it's action depending on the selection from a specific drop down menu.
On change should trigger the script and change the action before user submits. Easier said than done when you're new to JS.. thanks for any help!
Javascript:
<script type="application/javascript">
function chgAction(form1){
if( recipient=="jordachedotcom_Advertising" )
{document.form1.action = "/adv_contact.php";}
else if( recipient=="dept_Public_Relations" )
{document.form1.action = "/pr_contact.php";}
else if( recipient=="dept_Manufacturing" )
{document.form1.action = "/manuf_contact.php";}
else if( recipient=="dept_Brands" )
{document.form1.action = "/brands_contact.php";}
else if( recipient=="dept_Holdings" )
{document.form1.action = "/holdings_contact.php";}
else if( recipient=="dept_Vendor_Inquiry" )
{document.form1.action = "/vend_contact.php";}
else if( recipient=="dept_Other_Inquiry" )
{document.form1.action = "/misc_contact.php";}
}
</script>
FORM HTML:
<form id="form1" name="form1" method="post" action="/">
Please choose a dept:<br/>
<select name="recipient" id="recipient" size="1" onChange="javascript:chgAction()">
<option value="" selected="selected">Select</option>
<option value="dept_Advertising">Advertising</option>
<option value="dept_Public_Relations">Public Relations</option>
<option value="dept_Manufacturing">Manufacturing</option>
<option value="dept_Brands">Brands</option>
<option value="dept_Holdings">Holdings</option>
<option value="dept_Vendor_Inquiry">Vendor Inquiry</option>
<option value="dept_Other_Inquiry">Other Inquiry</option>
</select>
<input type="submit">
</form>
Your code is missing the part to get the selected item from the selectbox.
document.form1.recipient.selectedIndex
The rest should be ok and i have created a Fiddle
I'm guessing as to your full intent, but I think that the best way to accomplish what you're doing here would be via php on the server side. Have the form direct to one particular page and then using your server-side language redirect to the proper url. For example, if you're using php do something like this:
client-side (html)
(note how the action property of the form is one fixed location)
<form id="form1" name="form1" method="post" action="./form-handler.php">
Please choose a dept:<br/>
<select name="recipient" id="recipient" size="1">
<option value="" selected="selected">Select</option>
<option value="dept_Advertising">Advertising</option>
<option value="dept_Public_Relations">Public Relations</option>
<option value="dept_Manufacturing">Manufacturing</option>
<option value="dept_Brands">Brands</option>
<option value="dept_Holdings">Holdings</option>
<option value="dept_Vendor_Inquiry">Vendor Inquiry</option>
<option value="dept_Other_Inquiry">Other Inquiry</option>
<select>
<input type="submit">
</form>
No javascript required!
server-side (php)
form-hander.php:
<?php
$recipient = $_POST['recipient'];
//Based on the value of the $recipient value redirect to the correct page
//using the header function
switch($recipient) {
case 'dept_Manufacturing':
header('Location: ./manuf_contact.php'); exit;
case 'dept_Brands':
header('Location: ./brands_contact.php'); exit;
case 'dept_Holdings':
header('Location: ./holdings_contact.php'); exit;
//... etc, etc
}
On your on change function, you can obtain your currently selected element using:-
var currentValue = $("#recipient option:selected").val();
And then apply these if checks as you specified on this currentValue var as shown below:-
if(currentValue == "dept_advertising"){
$("#form1").attr("action",customURL);
}
Try this
<form id="form1" name="form1" method="post" action="/">
Please choose a dept:<br/>
<select name="recipient" id="recipient" size="1" onChange="javascript:chgAction()">
<option value="" selected="selected">Select</option>
<option data-action="/adv_contact.php" value="dept_Advertising">Advertising</option>
<option data-action="/pr_contact.php" value="dept_Public_Relations">Public Relations</option>
<option data-action="/manuf_contact.php" value="dept_Manufacturing">Manufacturing</option>
<option data-action="/brands_contact.php" value="dept_Brands">Brands</option>
<option data-action="/holdings_contact.php" value="dept_Holdings">Holdings</option>
<option data-action="/vend_contact.php" value="dept_Vendor_Inquiry">Vendor Inquiry</option>
<option data-action="/misc_contact.php" value="dept_Other_Inquiry">Other Inquiry</option>
</select>
<input type="submit">
</form>
<script>
function chgAction(){
$('#form1').attr({'action':$('option:selected').attr('data-action')});
$('#form1').submit();
}
</script>
You could also just use the actual form action URLs as the option values and use a simple one line onchange attribute without any additional JS:
<form method="post" name="form1">
<select id="form_action" name="form_action" onchange="document.form1.action = this.value;">
<option value="https://url1.com">URL1</option>
<option value="https://url2.com">URL2</option>
</select>
</form>
Tested and working in Firefox. May possibly benefit from some measures to make it more cross-browser compatible.
Replace:
function chgAction(form1){...}
in
chgAction = function(form1) {....}
Code will work but it is not the ultimate dream. Better to use something like that:
(function(){
var form = document.querySelector('#form1'),
select = form.querySelector('#recipient'),
action = {
'jordachedotcom_Advertising': '/adv_contact.php',
'dept_Public_Relations': '/pr_contact.php',
'dept_Manufacturing': '/manuf_contact.php',
'dept_Brands': '/brands_contact.php',
'dept_Holdings': '/holdings_contact.php',
'dept_Vendor_Inquiry': '/vend_contact.php',
'dept_Other_Inquiry': '/misc_contact.php'
};
select.addEventListener('change', function () {
var el = this, value = el.value;
if (action[value]) {
form.action = action[value];
}
}, false);}());
Like jQuery:
(function($){
var form = $('#form1'),
select = $('#recipient'),
action = {
'jordachedotcom_Advertising': '/adv_contact.php',
'dept_Public_Relations': '/pr_contact.php',
'dept_Manufacturing': '/manuf_contact.php',
'dept_Brands': '/brands_contact.php',
'dept_Holdings': '/holdings_contact.php',
'dept_Vendor_Inquiry': '/vend_contact.php',
'dept_Other_Inquiry': '/misc_contact.php'
};
select.on('change', function () {
var el = $(this), value = el.val();
if (action[value]) {
form.attr('action', action[value]);
}
});}(jQuery));
I use the Jquery_Form plugin and i would like to get the value of disabled select box.
HTML form :
<form id="myform" method="post">
<select name="myselect" id="myselect">
<option value="1">Option1</option>
<option value="2">Option2</option>
<option value="3">Option3</option>
</select>
<input type="submit" value="send">
</form>
Javascript :
<script>
$('#myselect').val('2').attr('disabled', true);
$(document).ready(function() {
var options = {
target: '#response',
};
$('#myform').ajaxForm(options);
});
</script>
PHP :
if (isset($_POST['myselect']))
echo $_POST['myselect'];
else
echo "Oups nothing :(";
I always "get Oups nothing"
The value of a disabled input/select box is not transmitted. How about disabling all non-selected values instead?
$('#myselect option:not(:selected)').prop('disabled', true);
is method not methode (see the form) soo is not $_POST is Anything
<form id="myform" methode="post"> //NO
<form id="myform" method="post"> //YES
Finaly i think that i have to put a hidden input that contain the value.
example :
<select name="myselect" id="myselect" disabled>
<option value="1">Option1</option>
<option value="2">Option2</option>
<option value="3">Option3</option>
</select>
<input type="hidden" name="myselect" value="2">
Or just remove "disabled" before sending :
$('form').bind('submit', function() {
$(this).find(':disabled').removeAttr('disabled');
});
If you want to get a value from a particular selectList's item, can you try with:
$('#myselect option:contains(1)').val();
Cheers.