I want to disable a button after the button onclick and then enable the other one .
echo '<input type="text" id="txtbox1" name="tb1" value="'.$value.'" />';
echo '<input type="submit" id="btn1" name = "btnstart" value="START" onClick="this.disabled=true;"/><input type="submit" id="btn2" name = "btnend" value="End" onClick="this.disabled=true;"/>';
In this case, i can only disable the button but the rest of the process skipped. I cannot update the input textbox value.
Also, How can i disable the btn2 the before onclick btn1?
$value= $_POST['tb1'];
echo '<form name="f1" method="POST" action="">';
echo '<input type="text" id="txtbox1" name="tb1" value="'.$value.'" />';
echo '<input type="submit" id="btn1" name = "btnstart" value="START" onClick="this.disabled=true;"/><input type="submit" id="btn2" name = "btnend" value="End" onClick="this.disabled=true;"/>';
echo '</form>';
echo '</td>';
if ( isset( $_POST['tb1'] ) ) {
$new = $value *12;
}
Try this:
<input type="submit" id="btn1" name = "btnstart" value="START" onClick="document.getElementById('btn2').disabled=false;this.disabled=true;"/>
<input type="submit" id="btn2" name = "btnend" value="End" onClick="this.disabled=true;" disabled/>
Working example: jsfiddle
Can you try this,
How can i disable the btn2 at the before onclick btn1?
Added onClick="document.getElementById(\'btn2\').disabled=true;this.disabled=true;"
echo '<input type="text" id="txtbox1" name="tb1" value="'.$value.'" />';
echo '<input type="submit" id="btn1" name = "btnstart" value="START" onClick="document.getElementById(\'btn2\').disabled=true;this.disabled=true;"/>
<input type="submit" id="btn2" name = "btnend" value="End" onClick="this.disabled=true;"/>';
try jquery
first load the html with submit button 2 disabled
echo '<input type="text" id="txtbox1" name="tb1" value="" />';
echo '<input type="submit" id="btn1" name = "btnstart" value="START" /><input type="submit" id="btn2" name = "btnend" value="End" disabled="disabled" />';
then using jquery
$(document).ready(function(){
$("input[type='submit']").click(function(){
$("input[type='submit']").prop('disabled',false);
$(this).prop('disabled',true);
});
});
disable the clicked submit button and enable other submit button
I placed an example in jQuery. jQuery is much easier then normal Javascript. Dont forget that jQuery is still javascript but then with functions that are already named to do their function:
.click() //When clicked
.next() //Next element/attribute
.mouseenter //When hover
.text() //Set the text
$('#mydiv').text('Contains this text');
Do the codecadamy.com training, its very helpfull, easy to follow and very quick.
I placed an example in jQuery for you:
JSFiddle
Related
I have a simple form in HTML that contains two buttons. Button 1 which action in the form tag submits it to another php page e.g. button1-action.php which submits data to a third party API and Button 2 which I want to submit to the same page if it is clicked without going to button1-action.php.
In its simplest method the form is as follows:
<?php
echo '<form name="form123" id="form123" action="button1-action.php" method="POST">';
echo '<input type="text" name="first_name" id="first_name></input>';
echo '<button name="button1" id="button1" value="button1">Button 1</button>';
echo '<button name="button2" id="button2" value="button2">Button 2</button>';
echo '</form>';
?>
This is what I tried so far
$action = null;
if (isset($_POST['button1'])) {
$action = 'button1-action.php';
} elseif (isset($_POST['button2'])) {
$action = $_SERVER["PHP_SELF"];
}
echo '<form name="form123" id="form123" action="' . $action . '" method="POST">';
echo '<input type="text" name="first_name" id="first_name></input>';
echo '<button name=" button1" id="button1" value="button1">Button 1</button>';
echo '<button name="button2" id="button2" value="button2">Button 2</button>';
echo '</form>';
However, it doesn't seem to be working. I tried to look for solutions but I haven't been successful.
I'm interested in any solution, but I would prefer solving it using PHP and not JavaScript.
The Issue might be that you forgot to close the <form> tag with </form> and you should use the <input> for buttons aswell with type="submit" .
If this still doesn't resolve your issue then maybe you should try this :
On the same page.
<?PHP
//// place this on top
if($_POST["button1"]) {
// add code to send data to Third Party API
}
if($_POST["button2"]) {
// will show data here
} ?>
////////
<?php
echo '<form name="form123" id="form123" action="/">';
echo '<input type="text" name="first_name" id="first_name></input>';
echo '<input type="submit" name="button1" id="button1" value="button1" >';
echo '<input type="submit" name="button2" id="button2" value="button2" >';
echo '</form>';
?>
I hope this answers your question 😊
This is the solution for you in html
<form name="form123" id="form123" method = "post">
<input type="text" name="first_name" id="first_name"></input>
<button name=" button1" id="button1" value="button1" formaction="button1-action.php" >Button 1</button>
<button name="button2" id="button2" value="button2" >Button 2</button>
</form>
button 1 will submit the form to button1-action.php and button 2 will submit the form to same page.
Documentation: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-formaction
You appear to be using the value submitted from the form to set the action of the form. This makes no sense - by the time you read the submitted values, the action has already happened. So your code would just set the action for next time the form is submitted. Not useful.
At the heart of this there seems to be a conceptual / design issue. A more sensible approach (but not the only one) would be to simply post the form to the same place every time, and then use if statements to decide what to do next.
e.g.
if (isset($_POST['button1'])) {
require_once "button1-action.php";
} elseif (isset($_POST['button2'])) {
//do whatever it is you want to do in ths script
}
else {
?>
<form name="form123" id="form123" method="POST">';
<input type="text" name="first_name" id="first_name></input>
<button name=" button1" id="button1" value="button1">Button 1</button>
<button name="button2" id="button2" value="button2">Button 2</button>
</form>
<?php
}
To improve a bit more on that, instead of using a bare require to include the code from another script, we could encapsulate the code from button1-action.php into a function which we can call, instead of a script with global scope. This makes the code more re-usable, maintainable, testable, less likely to cause scope conflicts, etc.
e.g.
if (isset($_POST['button1'])) {
callTheApi($_POST["first_name"]);
} elseif (isset($_POST['button2'])) {
doSomethingElse($_POST["first_name"]);
}
else {
?>
<form name="form123" id="form123" method="POST">';
<input type="text" name="first_name" id="first_name></input>
<button name=" button1" id="button1" value="button1">Button 1</button>
<button name="button2" id="button2" value="button2">Button 2</button>
</form>
<?php
}
(Even better if you then encapsulate that function in a class containing closely related functionality, but let's just get as far as a funtion for now.)
Alternatively, Virender Kumar's answer would also be reasonable - simply setting the form action of each button directly.
First of all your form is not structured properly.
index.php
<form name="form123" id="form123" action="button1-action.php">
<input type="text" name="first_name" id="first_name"></input>
<button name=" button1" id="button1" value="button1">Button 1</button>
<button name="button2" id="button2" value="button2">Button 2</button>
</form>
button1-action.php
if (isset($_GET['button1'])) {
echo 'button1 submitted'; // Send data to the third party API
} else if (isset($_GET['button2'])) {
echo 'button1 submitted'; // Submit on the same page
}
Edit: ignore my solution; Virender Kumar’s solution here is correct, elegant and doesn’t need JS.
Original answer:
The issue is not with your buttons, but with the fact that a form can only post to a single endpoint (the action attribute). You will have to handle what happens with the form data from there. If you truly want your form to be posted to a different endpoint in the client based on what button the user clicks, you can’t do it without JavaScript.
If you can live with JS, this could work:
<body>
<!-- your form here -->
<script>
const form = document.forms[0]; // assuming your form is the first form on the page, or the only one
document.querySelectorAll('button').forEach(button => {
button.addEventListener('click', event => {
if (event.target.name === 'button1') {
form.action = 'button1-action.php';
} else if (event.target.name === 'button2') {
form.action = 'other-destination';
}
});
});
</script>
</body>
I have this HTML button:
<form action="testscript.php" name ="more" method="get">
<input type="submit" value="More Details">
</form>
Which when clicked runs this PHP script:
<?php echo 'button pushed: ';
echo $buttonvalue;
?>
My question is, how to I assign a value to the button so that when its clicked it will forward its value ($buttonvalue) to the PHP script
For example when the button is clicked i want it to run the script and the result should be button pushed: blue
How do i assign "blue" to the button?
you can try this
HTML :
<form action="testscript.php" name ="more" method="get">
<input type="hidden" name="buttonvalue" value="Some Value">
<input type="submit" value="More Details">
</form>
PHP :
<?php
echo 'button pushed: ';
echo !empty($_GET['buttonvalue']) ? $_GET['buttonvalue'] : '';
?>
Use anchor tag with 'btn' class. And pass value to next page with id.
Page 1.
<a class="btn btn-primary" href="next-page.php?id=value">Click me</a>
Page 2.
$buttonvalue = $_GET['id'];
echo $buttonvalue;
<form action="testscript.php" name ="more" method="get">
<input type="hidden" name="getDataName" value="123">
<input type="submit" value="More Details">
</form>
PHP script:
<?php
$buttonvalue= isset ($_GET['getDataName']) ? $_GET['getDataName'] : '';
if(!empty($buttonvalue)){
echo 'button pushed: ';
echo $buttonvalue;
}else{
echo 'button not pushed: ';
}
?>
hi i have a javascript function which opens a pop-up window and opens a php file into it but i even want to send a parameter with it but it doesnt work the parameter is sent as a variable name instead of its value
here is my script
<?php
if($addflag == 0){
echo "
<script type=\"text/javascript\">
function mopen(){
var mobj=document.getElementById('dtype').value; //// this variable is shown as a name instead of its value
window.open('quotprin.php?vouchno=' . urlencode($getvouch) . '&dtype=mobj','popUpWindow','height=800,width=950,left=100,top=100,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes');
}
</script>
";
echo "<td>";
echo '<font color="red">Print On Letter Head</font>
<input type="checkbox" id="dtype" name="dtype" value="1" checked="checked" />';
echo '<input class="cmdprint" type="button" id="submit" name="print" value="Print" onclick="mopen();"></td>';
echo "<td>";
}
?>
This is not exactly your original code, but it works. You have too many escape slashes and single or double quotes. It can be too confusing to figure out errors like this.
<?php
$getvouch = isset($_GET['getvouch'])? $_GET['getvouch'] : null;
?>
<script type="text/javascript">
function mopen(){
var mobj=document.getElementById('dtype').value;
var url="quotprin.php?vouchno=<?php echo $getvouch; ?>&dtype="+ mobj;
window.open(url,'popUpWindow','height=800,width=950,left=100,top=100,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes');
}
</script>
<table><tr><td>
<font color="red">Print On Letter Head</font>
<input type="checkbox" id="dtype" name="dtype" value="1" checked="checked" />
<input class="cmdprint" type="button" id="submit" name="print" value="Print" onclick="mopen();"></td>
</tr></table>
Most important here is to see how the "getvouch" variable is added to the getmobi url.
If you use this url: add-a-javascript-var-and-send-it-with-post.php?getvouch=6
get mobi links to : quotprin.php?vouchno=6&dtype=mobj
If this is not the issue, please explain a little better.
UPDATE.
Now I see the error is you did not escape the mobj variable in the url. try the changes.
try this:
<?php
if($addflag == 0){
$getvouch = urlencode($getvouch);
echo "
<script type=\"text/javascript\">
function mopen(){
var mobj=document.getElementById('dtype').value; //// this variable is shown as a name instead of its value
window.open('quotprin.php?vouchno= {$getvouch}&dtype=mobj','popUpWindow','height=800,width=950,left=100,top=100,resizable=yes, scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes');
}
</script>
";
echo "<td>";
echo '<font color="red">Print On Letter Head</font>
<input type="checkbox" id="dtype" name="dtype" value="1" checked="checked" />';
echo '<input class="cmdprint" type="button" id="submit" name="print" value="Print" onclick="mopen();"></td>';
echo "<td>";
}
?>
hi i have a check box and a button which opens a popup window on a button click i am sending a parameter which works fine now i have added a check box and i want to send its value as a parameter too and i am stuck here n have no idea of what has to be done
here is my script
<?php
if($addflag == 0){
echo "<td>";
echo '<font color="red"><strong>Print On Letter Head</strong></font><input type="checkbox" id="dtype" name="dtype" value="1" checked></input>';
echo '<input class="cmdprint" type="button" id="submit" name="print" value="Print" onclick="window.open(\'quotprin.php?vouchno='.$getvouch.'&dtype=\'document.getElementById(\'status1\').value;\'\',\'popUpWindow\',\'height=800,width=950,left=100,top=100,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes\');"></td>';
echo "<td>";
}
?>
somthing like this should work.
on suggestion try to avoid inline js and use functions instead.
other suggestion try to use checked="checked" instead of checked.
add this to javascript
<?php
if($addflag == 0){
echo '
<script type="text/javascript">
function mopen(){
var mobj=document.getElementById(\'dtype\');
var mval=mobj.value;
window.open(\'quotprin.php?vouchno='.$getvouch.'&dtype=mval\',\'popUpWindow\',\'height=800,width=950,left=100,top=100,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes\');
</script>
';
}
and the PHP
<?php
if($addflag == 0){
echo "<td>";
echo '<font color="red"><strong>Print On Letter Head</strong></font>
<input type="checkbox" id="dtype" name="dtype" value="1" checked="checked" />';
echo '<input class="cmdprint" type="button" id="submit" name="print" value="Print" onclick="mopen();"></td>';
echo "<td>";
}
?>
<a href="companies.php?id='. $_GET['id'] .'&offset='. $next_offset .'"><input id="button" type="button" value="More"/>
i somehow want to send &offset=avalue but useing a input button. without the id.
how can i do the similer thing with useing form action get ?
like ( warning epic fail ) i should add a hidden input or something ?
echo '<form action="welcome.php" method="get">';
echo '<input id="button" type="button" value="More"/>';
echo '</form>';
please comment if you guys dont understand thanks!
ok somehow i have manage to make it work
echo '<form action="companies.php?id='. $_GET['id'].'" method="get">';
echo '<input type="hidden" name="offset" value="'.$next_offset.'">';
echo '<input id="button" type="submit" value="More"/></a>';
echo '</form>';
but still have an error http://local.host/networks/companies.php?offset=5, where does my get id goes ?
btw im still checking it out and thanks guys :)
and aha! it works
// MORE PLUGIN
echo '<form action="companies.php" method="get">';
echo '<input type="hidden" name="id" value="'.$_GET['id'].'">';
echo '<input type="hidden" name="offset" value="'.$next_offset.'">';
echo '<input id="button" type="submit" value="More"/></a>';
echo '</form>';
// END PLUGIN
For one thing, you can put parameter in the form's action attribute, just like you did with the link and href.
More readable option is hidden input element: <input type="hidden" name="offset" value="your_value">
Is this what you asked?
<? echo '<input type=button onclick=\'window.location="companies.php?offset='. $next_offset .'"\'>';?>