Edit data from database in form when using radio button - javascript

I have a database with some information which i then show using php and javascript
If i click on edit a javascript form opens up and i can edit the shown information. This all works great but instead of an input field (in which i show the data currently inside of the database) i would like to use a radio button.
So i need to make a radio button with the values Yes and No and if the information inside the database = 0 i want to show no and 1 to show yes
When using an input field i see yes or no (depending on what is stored inside the database) how can i use a radio button in this scenario.
my input field looks like this
<input type='text' class='input' name='test_" +id+ "' value='"+test+"' />

Considering you have html like this:
<form name="yesnoform">
<label for="no">No</label><input value="no" type="radio" name="yesno" id="no"/>
<label for="yes">Yes</label><input value="yes" type="radio" name="yesno" id="yes"/>
</form>
you can use this code to select correct radio button:
var fromDB = 0;
document.yesnoform.yesno[fromDB].checked=true;
If you want yes radio button first:
<form name="yesnoform">
<label for="yes">Yes</label><input value="yes" type="radio" name="yesno" id="yes"/>
<label for="no">No</label><input value="no" type="radio" name="yesno" id="no"/>
</form>
then use this:
var fromDB = 0;
var value = fromDB === 0 ? 1 : 0;
document.yesnoform.yesno[value].checked=true;
Here is JSBin: https://jsbin.com/fijiteruba/edit?html,js,output
Hope this helps.

Related

Get values of all checked radio buttons using JQuery

Using JQuery I am trying to perform validation and also get the values of all the dynamically generated Radio buttons in the page.
I have 10 questions on my page and each question has a Radio button group(YES/NO).
when click in the radio button i want to send it's value to database for the question, this is my code
<p>Question 1</p>
<input id="1_1" type="radio" name="1" value="Yes" />
<input id="1_2" type="radio" name="1" value="NO" />
i searched in google and found this code
$('input[name=radioName]:checked', '#myForm').val()
But I don't know what is the right way to use it ?
As per your HTML structure try this :-
var arr = []; // take an array to store values
$('input[type="radio"][name="1"]:checked').each(function(){
arr.push($(this).val()); //push values in array
});
If you want the values of all <radio> you can do
var ans = $('[name=1]:checked').map(funciton(){
return $(this).val();
}).get();

set groupt of radion value jquery

i have a group ooa radion buttons defined as so
<input type="radio" name="required[status]" id="status" value="1">Yes </label>
<input type="radio" name="required[status]" id="status_1" value="0"> No </label>
<input type="radio" name="required[status]" id="status_2" value="2">Maybe </label>
this is stores the value 0,1,2 in a field status in the db
later, i get the value from db as 1, how do i use jquery to check the appropriate radio button?
if you are trying to check the radio button element by its value you can you the jquery attribute selector.
click me
you can get the element by its value like this:
$('[value=VALUE_FROM_DB]').prop("checked", true);

Radio buttons to new page

Hey guys sorry to ask this, but I am stumped, I want the code to go to the pages with the action when the radio button is clicked, like stupid radio button to stupid.php here's the form
<form name = "quoted" method="get">
<input id = "poster" type="text" name="poster" required="required" placeholder = "Credited Individual.">
<br>
<textarea class = "actual_quote" name = "actual_quote" required="required" placeholder = "Write the question here!"></textarea>
<br><br><br>
<div class = "checkboxes" required="required">
<h3 style = "margin-top:-20px;">Please select one catagory that the quote falls into.</h3>
<label for="x"><input type="radio" name="x" value="stupid" id = "x" checked="checked" action = "stupid.php" /><span>stupid</span></label>
<br>
<label for="x"><input type="radio" name="x" value="stupider" id = "x" action = "stupider.php" /><span>stupider</span></label>
<br>
<label for="x"><input type="radio" name="x" value="stupidest" id = "x" action = "stupidest.php" /><span>stupidest</span></label>
</div>
<input id = "submit1" type="submit"><br>
</form>
and here's the php on each of the pages, stupid, stupider, and stupidest, the php error is saying that actual-quote and poster are not identified indexes, help?
<div class="wrapper">
<div class="submissions">
<div class="logo-logo"><h2>Question.</h2>
<div class="checkboxes"><?= !empty($_GET['x']) ? $_GET['x'] : '' ?>
</div>
</div>
<div class="top-submit"><?php echo '“' . (!empty($_GET['actual_quote']) ? $_GET['actual_quote'] : '') . '”'; $actual_quote = $_GET['actual_quote'];?>
</div>
<div class="poster"><?php echo "-" . (!empty($_GET['poster']) ? $_GET['poster'] :''); $poster = $_GET['poster'];?>
<div class = "like">
Like
<p id = "like" style = "color:green;">0</p>
</div>
<div class = "dislike">
Dislike
<p id = "dis" style = "color:red;">0</p>
</div>
</div>
<?php
"INSERT INTO submissions(top-submit, poster)
VALUES ($actual_quote, $poster)";
?>
</div>
</div>
I am sorry to ask, but I have been trying for an hour and I have run out of ideas. Any suggestions is GREATLY welcomed.
Just to clarify, I want each of the radio buttons, when selected, to a new page once they click the submit button, i want to have them check one radio option, and then click submit and be directed to the page.
v
DEMO
<label for="x"><input type="radio" name="x" value="stupid" id = "x" checked="checked" action = "stupid.php" /> <span>stupid</span></label><br>
Based on your radio buttons,
$("input[type=radio]").click(function() {
window.location.href = $(this).attr("action");
});
So when the user clicks on any one of the radio buttons, the click handler will take him to the respective page mentioned in the action attribute.
In case if you want to redirect only if the radio button is checked and not when its unchecked, use if($(this).is(":checked")) to check the condition
I fail to understand why are you not using anchors for redirecting instead of messing up with inputs. If you use anchors, then you don't need any custom attributes of action on inputs.
Moreover if you have a form then why not simply use it's action attribute for the purpose. And in the backend you can handle the redirect easily instead of relying on the javascript redirect.
Still, if you want to use inputs for navigation and redirecting and since you didn't mentioned anything about jQuery, I assume you need pure Javascript solution. You can use inline javascript in the inputs like:
<label><input type="radio" action="http://www.google.com" onclick="window.location.href=this.action;" />Google</label>
If you need a jQuery solution, refer to the solution provided above by mohamedrias.
Are you trying to post values to different php files based on the selection of radio button. If yes, I think you can achieve the same using jquery.
$("input[type='radio']").click(function(){
$("form").attr('action',$(this).attr('action'));
});
The above code will add click event handlers to all the radio buttons. When the user clicks the radio button, the action property from the radio button will be set to the form. When the form is submitted, it will be calling the php file set in the action property of the currently selected radio button

How to select a input with name and value

I need to select a radio input with name and value in jquery
In this example how you select element with name SiblingSex and value female
<form action="">
<input type="radio" name="SiblingSex" value="male">Male<br>
<input type="radio" name="SiblingSex" value="female">Female
<input type="radio" name="ParentSex" value="male">Male<br>
<input type="radio" name="ParentSex" value="female">Female
</form>
i need some thing like
$('input[name="SiblingSex"]' /*GENDER SELECTOR */)
You can add another attribute selector with this:
$('input[name="SiblingSex"][value="female"]').val();
the above line would give you values every time whether it is checked or not.
so if you only want to have the value when it is checked too then add :checked
$('input[name="SiblingSex"][value="female"]:checked').val();
Just have a look on the Demo on my JS Fiddle Code
Shows the two scenario:
1) when you want the value without selecting radio button.
2) when you want value after selecting radio button.
or may be the thing that you want is here::
JS Fiddle Demo

how to get the value of a radio button on jsp

I'm trying to get the value of a radio button on my JSP page with
document.getElementById('rButton').value
when I press a submit type button, but the line above only returns the value the radio button started with. It does not return the actual value of it. (true/false)
How can I check the actual value of the radio Button?
I'd appreciate some help. :)
Thanks.
Radio buttons (and checkboxes) have a checked property. Their value property/attribute is the value that is sent when they are checked.
try checked instead of value.
HTML:
<input type="radio" name="group2" value="Water"> Water<br>
<input type="radio" name="group2" value="Beer" checked> Beer<br>
<input type="radio" name="group2" value="Wine"> Wine ​​​​​​​​​​​​
Javascript:
var radioBtns=document.getElementsByName("group2");
for(i=0;i<radioBtns.length; i++){
if(radioBtns[i].checked){
alert(radioBtns[i].value);
}
}​​

Categories