html reset text area on frame form submit - javascript

I want to reset the text area on my submit which sends data without changing the page.
<iframe name="votar" style="display:none;"></iframe>
<form id ="myForm" action="message-process.php" method="post" target="votar">
<?php
echo "<input type='hidden' name='userId' value= '$sendId'>";
?>
<textarea rows="5" cols="60" name="message" type="text" maxlength="255" style="font-size:10px background-color:grey;"></textarea>
<input type="submit" value="Send Message">
</form>

You can use HTML form attribute onsubmit="func()"
And inside a Javascript script set the value of what you wish to an empty string.

This code works.
<iframe name="votar" style="display:none;"></iframe>
<form id ="myForm" action="message-process.php" method="post" target="votar" onsubmit="this.submit(); this.reset(); return false;">
<?php
echo "<input type='hidden' name='userId' value= '$sendId'>";
?>
<textarea id ='input' rows="5" cols="60" name="message" type="text" maxlength="255" style="font-size:10px background-color:grey;"></textarea>
<input type="submit" value="Send Message">
</form>

Related

Hide text box before fetch data from mysql

i want that only text filed of student registration and button show on page then Student put their number in text field and clink on Submit button so the other all fields are fetch from database sql
but but but i done all only the problem is here that on php page all things are show already like text boxes i want only one text box and submit button on page before fetch the data .
after fetch the data from mysql database the other fields text boxes will Show
here my code
<div class="container">
<form id="contact" form action="mix.php" method="post">
<fieldset>
<input type="text" name="student_reg" required="required" placeholder="Student Registration Code" value="<?php echo $student_reg;?>">
</fieldset>
<div>
<!-- Input For Add Values To Database-->
<!-- Input For Find Values With The given ID -->
<input type="submit" class="myButton" name="search" style="width:100%;" value="Find">
</div>
<fieldset>
<input type="text" name="student_name" placeholder="Name" style="border:0;outline:none;width:100%;height:100%;font-size:13px;text-align: left;" value="<?php echo $student_name;?>" readonly>
</fieldset>
<fieldset>
<input type="text" name="phone_number" placeholder="Phone Mobile Number" style="border:0;outline:none;width:100%;height:100%;font-size:13px;text-align: left;" value="<?php echo $phone_number;?>" readonly>
</fieldset>
try this:
<div class="container">
<form id="contact" form action="mix.php" method="post">
<fieldset>
<input type="text" name="student_reg" required="required" placeholder="Student Registration Code" value="<?php echo $student_reg;?>">
</fieldset>
<div>
<!-- Input For Add Values To Database-->
<!-- Input For Find Values With The given ID -->
<input type="submit" class="myButton" name="search" style="width:100%;" value="Find">
</div>
<?php if(!empty($student_name)) { ?>
<fieldset>
<input type="text" name="student_name" placeholder="Name" style="border:0;outline:none;width:100%;height:100%;font-size:13px;text-align: left;" value="<?php echo $student_name;?>" readonly>
</fieldset>
<fieldset>
<input type="text" name="phone_number" placeholder="Phone Mobile Number" style="border:0;outline:none;width:100%;height:100%;font-size:13px;text-align: left;" value="<?php echo $phone_number;?>" readonly>
</fieldset>
<?php } ?>

Select form data in multiple forms

i have a php loop like this:
<?php foreach($result as $row) { ?>
<form action="" method="post" name="my-form" id="my-form">
<input type="hidden" name="user-id" id="user-id" value="<?php $row['user_id']; ?>">
<input type="submit" name="submit" id="submit" value="Submit">
</form>
<?php } ?>
It will output a form on each loop.
Here is my javascript code:
document.getElementById("appointment-single-form").onsubmit = function (e) {
ev.preventDefault();
var queryString = $('#appointment-single-form').serialize();
console.log(queryString); // output to console: user-id={user's id from the specific form that was clicked/submitted}
}
Depending on the form clicked/submitted, I need to get the form values using javascript.
Question: Only the first form is working because getElementById only workes for one id. how can i make it so that I can click on any form? thanks
Use the following code. Idea is use a common class for each form and attach submit event on that class.
// Attach submit event on class, that is common for each form
$('.my-forms').on('submit',function(ev){
ev.preventDefault();
var curObj = $(this),queryString = curObj.serialize();
console.log(queryString);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form action="" method="post" name="my-form1" id="my-form" class="my-forms">
<input type="hidden" name="user-id" id="user-id" value="1">
<input type="submit" name="submit" id="submit" value="Submit Form 1">
</form>
<form action="" method="post" name="my-form2" id="my-form" class="my-forms">
<input type="hidden" name="user-id" id="user-id" value="2">
<input type="submit" name="submit" id="submit" value="Submit Form 1">
</form>
<form action="" method="post" name="my-form3" id="my-form" class="my-forms">
<input type="hidden" name="user-id" id="user-id" value="3">
<input type="submit" name="submit" id="submit" value="Submit Form 1">
</form>
using jquery like this .Better use tagname or classname instead of ID of the form .Because Id is a unique
$(document).on('submit' ,'form',function(e){
e.preventDefault();
var query = $(this).serialize()
console.log(query)
})
Example
$(document).on('submit', 'form', function(e) {
e.preventDefault();
var query = $(this).serialize()
console.log(query)
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="" method="post" name="my-form" id="my-form">
<input type="hidden" name="user-id" id="user-id" value="<?php $row['user_id']; ?>">
<input type="submit" name="submit" id="submit" value="Submit">
</form>
<form action="" method="post" name="my-form" id="my-form">
<input type="hidden" name="user-id" id="user-id" value="<?php $row['user_id']; ?>">
<input type="submit" name="submit" id="submit" value="Submit">
</form>
<form action="" method="post" name="my-form" id="my-form">
<input type="hidden" name="user-id" id="user-id" value="<?php $row['user_id']; ?>">
<input type="submit" name="submit" id="submit" value="Submit">
</form>

Get a value from a different form in javascript and store in a php session

Am trying to get a value from a different form to store in a session. When the user clicks on Calculate on form one it opens form two.In form two the user enters a value in a textfield. Now incase the user presses the calculate button again I would want the page to store the values in form two in a session so that when form two re appears the value is stored.
is there a way to use javascript to store it in a php session
<?php
if(isset($_POST['calculate']))
{
$_SESSION['ss'] = '<script>doument.form[frm2].ss.value</script>';
}
?>
<form action="" method="post" name="frm1" id = "frm1" enctype="multipart/form-data" onkeypress="return event.keyCode != 13;">
<input type="text" name="id" value="<?php echo $id; ?>" />
<input type="submit" name="calculate" id="calculate">
<form>
<?php
if(isset($_POST['calculate'])){
?> ?>
<form action="go.php" method="post" name="frm2" id = "frm1" enctype="multipart/form-data" onkeypress="return event.keyCode != 13;">
<input type="text" name="ss" value="" />
<input type="submit" name="submit" id="submit">
<form>
<?php
}
?>
If you are using jQuery can try this way .
first define a hidden field in form 1
<form action="" method="post" name="frm1" id = "frm1" enctype="multipart/form-data" onkeypress="return event.keyCode != 13;">
<input type="text" name="id" value="<?php echo $id; ?>" />
<input type="hidden" id="hidden_ss" name="hidden_ss" value=""/>
<input type="submit" name="calculate" id="calculate">
</form>
Then in jQuery when you change the frm2 -> ss value add the value to hidden field
$("input[name='ss']").change(function(){
$("#hidden_ss").val($(this).val());
});
then wen you create calculate button
<?php
$ss = trim($_POST['hidden_ss']);
?>
<form action="" method="post" name="frm1" id = "frm1" enctype="multipart/form-data" onkeypress="return event.keyCode != 13;">
<input type="text" name="id" value="<?php echo $id; ?>" />
<input type="hidden" id="hidden_ss" name="hidden_ss" value=""/>
<input type="submit" name="calculate" id="calculate">
</form>
<?php
if(isset($_POST['calculate'])){
?> ?>
<form action="go.php" method="post" name="frm2" id = "frm1" enctype="multipart/form-data" onkeypress="return event.keyCode != 13;">
<input type="text" name="ss" value="<?php echo $ss; ?>" />
<input type="submit" name="submit" id="submit">
</form>
<?php
}
?>
I believe you don't need JavaScript for this.
Just something like this:
<form action="" method="post" name="frm1" id = "frm1" enctype="multipart/form-data" onkeypress="return event.keyCode != 13;">
<input type="text" name="id" value="<?=htmlentities($_SESSION['id'])?>" />
<input type="submit" name="calculate" id="calculate">
</form>
<?php
if(isset($_POST['calculate']))
{
$_SESSION['id'] = $_POST['id'];
?>
<form action="go.php" method="post" name="frm2" id = "frm1" enctype="multipart/form-data" onkeypress="return event.keyCode != 13;">
<input type="text" name="ss" value="<?=htmlentities($_SESSION['id'])?>" />
<input type="submit" name="submit" id="submit">
</form>
<?php
}
?>

Add Value To URL On Form Submit With Jquery

I have this form below when i submit it i want it to append a value to the 6 urls generated from a php query.
<form id="emailform" action="" method="post">
<input type="text" value="" size="30" name="email" id="email">
<input type="submit" name="submit" value="Submit" class="continue-button">
</form>
This is an example of my link, sitename.com/demo.php?1=demo&2=haha How can i use the form and jquery to append &email=formvalue to the url so sitename.com/demo.php?1=demo&2=haha = sitename.com/demo.php?1=demo&2=haha&email=formvalue ?
Please keep in mind that these urls are generated dynamically with a query.
I tried using attr on a but it doesnt work. I know you have to check for the submit then use attr.
$('#emailForm').submit(function(){ //listen for submit event
}
You can use hidden field like this
<form action="" method="post">
<input type="hidden" name="new_value" value="value"/>
<input type="text" value="" size="30" name="email" id="email">
<input type="submit" name="submit" value="Submit" class="continue-button">
</form>
or you can add to action of form like this
<form action="http://action_url?new_value=value" method="post">
<input type="text" value="" size="30" name="email" id="email">
<input type="submit" name="submit" value="Submit" class="continue-button">
</form>
You'd better to use markup input type="hidden" to submit the value
Your Form :
<form action = "sitename.com/demo.php" method="post" >
<input type="hidden" name="1" value="demo" />
<input type="hidden" name="2" value="haha" />
<input type="text" value="" size="30" name="email" />
<input type="submit" name="submit" value="Submit" class="containue-button" />
</form>
Then you just need to submit this form in javascript or jquery.
: )
use serilaize method
$('#emailForm').submit(function(){
//listen for submit event
var all_submit_data = $( '#emailForm' ).serialize() ;
//this will have all input fields values in serilized
}
ref : https://api.jquery.com/serialize/

Javascript do not submit form TRUE

<script type="text/javascript">
function myFunction(){
document.getElementById("form1").submit();
document.getElementById("form2").submit();}
</script>
<form id="form1" action="php/create.php">
Name </br><input type="text" name="inputName" value="" id=""> </input>
Hemsida </br><input type="text" name="inputPage" value="http://" id=""> </input>
<input type="button" onclick="return myFunction()" value="Submit"/>
</form>
<form id="form2" action="php/createhemerb.php">
<input type="text" name="inputFon" value="" id="fnid" hidden/>
<input type="text" name="inputJob" value="" id="fnid" hidden/>
</form>
I reach out to the php files but the both come out "please fill out the form 1" and "please fill out the form 2"
if(!$_POST['submit']) {
echo "please fill out the form";
header ('Location: please fill out the form 1');}
I have tried things back and fourth for hours i can not get it to work.
Please do the following to fix your issue:
Add method='post' to your forms
If you intend to check the value of $_POST['submit'], you need to name your button 'submit'.
You can't use echo and then header(''), it will set a 'header already sent exception'.
header('Location: some text') has no meaning, header('Location: file.html') is the correct syntax.
Full code:
<script type="text/javascript">
function myFunction(){
document.getElementById("form1").submit();
document.getElementById("form2").submit();
}
</script>
<form id="form1" action="php/create.php" method="post">
Name </br><input type="text" name="inputName" value="" id=""> </input>
Hemsida </br><input type="text" name="inputPage" value="http://" id=""> </input>
<input type="button" onclick="return myFunction()" value="Submit" name="submit"/>
</form>
<form id="form2" action="php/createhemerb.php" method="post">
<input type="text" name="inputFon" value="" id="fnid" hidden/>
<input type="text" name="inputJob" value="" id="fnid" hidden/>
</form>
PHP:
if(empty($_POST) || !$_POST['submit']) {
echo "please fill out the form";
//you can't set the header after echoing
//header ('Location: please fill out the form 1');//use header('Location: error.html') instead.
//or output a Javascript redirect echo "<script>window.location = 'error.html';</script>";
}
Hope this helps!

Categories

Resources