validate text area box after clicking particular radio button - php

hi my code in html is like this
<input type="radio" name='answer_value1[<?php echo $survey1->id?>]' value="<?php echo $answer1->id?>" validate="required:true" id="<?php $answer1->valdt == '1' ? print "welcome":""?>" />
And this is code for comment box
<textarea rows="5" cols="55" name="nn[<?php echo $survey1->id?>]" id="comment" ></textarea>
if the radio button id is "welcome" then i want to make the textarea should be validate otherwise not.
and i wrote some code in jquery
$(function() {
$('input[id="welcome"]')).change(function() {
$('textarea[id="comment"]').each(function(){
$(this).rules("add", {
required: true,
} );
} );
If i click this field first and after if i clicked another radio button it's still validate this textarea field.
please give me some idea

FYI, ajax is not for validation. Its for asynchronous fetching of data from the server.
if (document.getElementById('welcome').checked) {
var textarea = document.getElementById('comment');
if (textarea.value = '') {
// validation failed
return false;
} else {
return true;
}
}

Did you try this :
var v = document.getElementById("validation1");
ValidatorValidate(v);
by this line of code you can force validator to check validation.
so you can add validation control for your textBox and run above code on radio button selectedChanged event handler.

Related

getting selected radio button value in a popup

I have a submit button named "details:, and a table which had radio buttons in each rows.
On selecting radio button and then clicking on my details button I want a popup to appear.
I have used something like this: I am not sure if the code I tried is really pathetic, but plz help me.
The form I used is GET.
This is my radio button:
<input type="radio" name="ID" value="<?php echo $id; ?>" class="radioValue" />
This is my submit button:
<input type="submit" name="details1" value="Details" id="btndetails" class="btn" />
<div id="notice">
<div class="pop">
<?php
if(isset($_GET['details1']))
{
if(isset($_GET['ID']))
{
$n=$_GET['ID'];
echo$n;
//do some sql queries with the id
}
else echo"Fail";
}
?>
</div>
</div>
I have used jquery to ensure the clicks:
(function($)
{
$(function()
{
$('#btndetails').bind('click', function(e)
{
// Prevents the default action to be triggered.
if($('.radioValue').is(':checked'))
{
e.preventDefault();
$("#notice").css("display", "block");
}
else
{
<?php echo"Please select the radio button";?>');
}
});
});
})(jQuery);
the div notice is display:none;
Currently on clicking the radio button + details button i am getting a popup with msg "fail". How can I get my radio button value in the pop up? Is my method wrong? I need to get the radio value in php so that i can use it to retrieve my DB.
I dont want to use any plugins for popups. I want it only by using php,html, css .
Please help me.
This might be your problem:
<input type="submit" name="details1" value="Details" id="btndetails" class="btn" />
<div id="notice">
<div class="pop">
<?php
if(isset($_GET['details1']))
{
if(isset($_GET['ID']))
{
$n=$_GET['ID'];
echo$n;
//do some sql queries with the id
}
else echo"Fail";
}
?> // the first problem I found is here
</div>
</div>
also check your URL are you getting id parameter in query string

disabling user input php/html form

I have a HTML form which when the user clicks submit, all information is sent to email via a php script using the POST method. What i want to do is disable all user input after the submit button is clicked or grey out all text box input fields. How can i go about doing this?
the code for the submit button at the moment looks like this:
<input type="submit" value=" Continue " style="width:200px;height:40px">
Add below to each HTML input element you want to disabled. Since you have not mentioned I assume that you can use PHP for this.
<?php if(isset($_POST['submit'])) echo 'disabled="disabled"'; ?>
If you are using AJAX, when the event is fired, inside particular event
$("input").prop('disabled', true);
Onclick of submit button make all input to disabled
$("input").attr('disabled', true);
Since whether mail has been sent is server side processing, its better if you handle this from server end than from client side like jQuery and javascript :
$form_state = ($is_mail_sent)?"":"disabled='disabled'";
<input type="submit" <?php echo $form_state ?> value=" Continue " style="width:200px;height:40px">
without db interaction you can't do this out, have a flag in db table. Set the flag 1 if user submit a form, by default 0. Based on the flag value you can disable the form.
if(mailsent_status_of_the_user == 1){
$status = "disabled='disabled'";
}else{
$status = "";
}
<input type="submit" value=" Continue " <?php echo $status; ?> >
By using jQuery : $("input").prop('disabled', true);
But in pure Html is not possible without refreshing page !
Edit :
Javascript :
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function(e) {
$("#yourFormID").submit(function() {
$("#theInputToDisable").prop('disabled', true);
//Or to disable all inputs
//$(this).children("input").prop('disabled', true);
//$(this).children("input").attr('disabled', 'disabled');
return false;
})
});
</script>
HTML
<form id="yourFormID">
<input type="text" />
<input type="submit" value="Send"/>
</form>

Javascript Values not being submitted at POST

I have a form where the user clicks various radio groups, this generates a 'score' that is calculated with javascript, and populates a textbox at the top of the form with a running total.
When the form is submitted, the POST value for this textbox is empty, so when it moves onto the output sheet there is no value to display.
All other textboxes that are manually typed in work fine. All Names/Ids etc are correct, is there something I'm missing in order to get it to correctly retain the value generated by the JS in the POST value when the form is submitted?
This (populated from JS) doesn't work :
<input name="Result_AutoFail" type="text" class="ResultsBox" id="Result_AutoFail" size="2" maxlength="2" value="<?php echo htmlspecialchars($_POST['Result_AutoFail']); ?>"/>
but this (Manually typed in) does:
<input name="CustName" type="text" id="CustName" size="25" maxlength="25" value="<?php echo htmlspecialchars($_POST['CustName']); ?>"/>
The JS used to populate the box is this for each question, this works fine and puts the value into the box correctly as the user clicks each radio button for each question, just doesn't send it off to POST:
for (i=0;i<2;i++)
{
if (document.MonitorForm.SBI_CA027[i].checked == true)
{
CA027Selected = document.MonitorForm.SBI_CA027[i].value
}
}
if (CA027Selected == "Yes")
{
if (AutoFailCount == 0)
{
document.MonitorForm.Result_AutoFail.style.backgroundColor = "#008000";
}
else if (AutoFailCount >= 1)
{
document.MonitorForm.Result_AutoFail.style.backgroundColor = "#FF0000";
}
}
else if( CA027Selected == "No")
{
AutoFailCount = (AutoFailCount + 1);
if (AutoFailCount == 0)
{
document.MonitorForm.Result_AutoFail.style.backgroundColor = "#008000";
}
else if (AutoFailCount >= 1)
{
document.MonitorForm.Result_AutoFail.style.backgroundColor = "#FF0000";
}
}
Then is written into the textbox with:
document.MonitorForm.Result_AutoFail.value = AutoFailCount ;
Cheers!
Try writing the result into hidden input.
<input type="hidden" value="some_value" name="result" id="result" />
if you dont submit it from a formfield like input or textfield it wont come in the $_POST array
if you want to submit additional data in your post you have to write them in hidden inputs

PHP - Form: save entries/selections on form submit

I have a PHP form that has some drop down selections and text field entries. If the user selects the wrong item from the dropdown, when they submit the form, I have it so that it will show an error message to the user and force the browser to go back to the previous page. The problem is that the user has to re-enter all of the information.
How do I make the form save the data until the form submit is successful?
EDIT:
Form submit method is $_POST and the form is being submitted to another page.
This would have to be done with strictly PHP as Javascript/Jquery solutions can be script blocked by more secure users.
Here you go. This will work, and is not dependent on Javascript:
form.php //the form page
<?php session_start(); ?>
<form method="post" action="action.php">
<input type="text" id="input1" value="<?php echo (isset($_SESSION['fields']) ? $_SESSION['fields']['input1'] : '') ?>" />
<input type="text" id="input2" value="<?php echo (isset($_SESSION['fields']) ? $_SESSION['fields']['input2'] : '') ?>" />
</form>
action.php //the action page
<?php
session_start();
//do your validation here. If validation fails:
$_SESSION['fields']['input1'] = $_POST['input1'];
$_SESSION['fields']['input2'] = $_POST['input2'];
//redirect back to form.php
?>
Is the form a POST or a GET? Either way, you have access to all the submitted fields in the PHP variables $_POST or $_GET. Within your HTML you can pass those values (if set), to the default value of each HTML input element. This way, if it is a first time, they will be blank, if there was an error, the values will repopulate.
If they're select values, you can do something like this:
<select name="my_select" id="my_select">
<option value="123"<?php if($_REQUEST['my_select'] == 123) echo ' selected="selected"; ?>>123</option>
</select>
If you have regular text inputs, you can simply apply the $_REQUEST variable to the value attribute:
<input type="text" name="my_text" value="<?php echo $_REQUEST['my_text'] ?>" />
I suggest a preventing the page from navigating away from the submission until the data is verified. Enter jQuery :)
<script type="text/javascript" src="jquery-library.js"></script>
<script type="text/javascript">
$(document).ready(function(){
// Wait for the user to click on your button
$('#submit_button').click(function(){
// Check each form field for an appropriate value
if ($('#form_field1').val() != 'something I expect')
{
alert('Wrong submission!');
return false;
}
// Forward the user to some url location
window.location = 'url';
return false;
});
});
</script>

Form validated but still submitting without values?

im using javascript validation to check for values within each form field before the form sends to the database but when i click submit the form still sends even without any values.
To test it i clicked on each of the fields to clear them and then tried submittin the button
here is the form
<form method="post" action="send.php" id="theform" name="theform">
<input type="text" name="firstname" id="firstname" value="First Name" onFocus="this.value=''" class="yourinfo" ><br/>
<input type="text" name="lastname" id="lastname" value="Last Name" onFocus="this.value=''" class="yourinfo"><br/>
<input type="text" name="email" id="email" value="Email Address" onFocus="this.value=''" class="yourinfo"><br/>
<div id="datepicker"></div>
<input type="hidden" name="date" id="date">
<input type="image" src="images/sbmit-button.png" name="submit" height="49" width="190" id="submit" value="submit" style="margin-top:10px; margin-left:-2px;" >
</form>
heres the javascript
$(document).ready(function(){
// Place ID's of all required fields here.
required = ["firstname", "lastname", "email"];
// If using an ID other than #email or #error then replace it here
email = $("#email");
errornotice = $("#error");
// The text to show up within a field when it is incorrect
emptyerror = "Please fill out this field.";
emailerror = "Please enter a valid e-mail.";
$("#theform").submit(function(){
//Validate required fields
for (i=0;i<required.length;i++) {
var input = $('#'+required[i]);
if ((input.val() == "") || (input.val() == emptyerror)) {
input.addClass("needsfilled");
input.val(emptyerror);
errornotice.fadeIn(750);
} else {
input.removeClass("needsfilled");
}
}
// Validate the e-mail.
if (!/^([a-zA-Z0-9_\.\-])+\#(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/.test(email.val())) {
email.addClass("needsfilled");
email.val(emailerror);
}
//if any inputs on the page have the class 'needsfilled' the form will not submit
if ($(":input").hasClass("needsfilled")) {
return false;
} else {
errornotice.hide();
return true;
}
});
// Clears any fields in the form when the user clicks on them
$(":input").focus(function(){
if ($(this).hasClass("needsfilled") ) {
$(this).val("");
$(this).removeClass("needsfilled");
}
});
});
im also linking to a jquery file:
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
ive tested it on its own and it seems to work but something seems to be over riding it and skipping past the validation in this page
==================================================================================
i still not working... basicallly do u think it might have something to do with the jquery UI datepicker that im also using with the form?? ive not included that in the form validation as i only wanted to make sure the firstname, lastname and email was filled out
i have this included in my form page:
<script>
$(function() {
$("#datepicker").datepicker({
altField: '#date'
});
$('#submit').click(function() {
$('#output').html($('form').serialize());
});
});
</script>
would this be having an effect of it submitting even though there are no values in the fields?
something is definatley overriding the validation and submitting it
It's working for me! (but it's probably not working how you imagine it should)
Once you enter a valid email, the form is sent if you hit submit. Why? Because you have already filled in firstname and lastname for the user - with the strings First Name and Last Name!
So you shouldn't just check for empty or error string filled first and last names, but you should also trigger an error if the first name is First Name or the last name is Last Name.
// Check for empty value, the error string
// OR the default values of "First Name" and "Last Name"
if ((input.val() == "") ||
(input.val() == emptyerror) ||
(input.val() == "First Name") ||
(input.val() == "Last Name")) {
input.addClass("needsfilled");
Working example
(I assume you use server side validation as the final check, since people like me just love NoScript. )
(Also you declare 5 global variables at the top of your code and one more global in your for loop (i)... don't forget var.. just like you used for input)
What if I disabled JavaScript? You should (also) validate on the server side.
Also refactor your code! You can start with extracting methods.
You need to cancel the submit event. It looks like you're trying to do this with a return false or a return true. However, with jQuery you'll need to do it a slightly different way.
First, you'll need to have an argument name for the JavaScript event. I typically use e.
$("#theform").submit(function(e){
Then you'll need to update the following code as follows:
//if any inputs on the page have the class 'needsfilled' the form will not submit
if ($(":input").hasClass("needsfilled")) {
e.preventDefault();
} else {
errornotice.hide();
}
The e.preventDefault() stops the event from being processed. In this case, that means the form will not be submitted.

Categories