<script type="text/javascript">
$(document).ready(function(){
$('#btnSubmit').bind('click', function(){
$('.hiddenId').each(function(){
var id = $(this).val();
var option = $('#option_' + id).val();
if(!option){
alert('Answer empty');
return false;
}
});
)};
});
</script>
...
<input type="hidden" class="hiddenId" name="question[]" value="<?php echo $question->id ?>" />
<input type="radio" id="option_<?php echo $question->id ?>" value="<?php print_r($option[$i]); ?>" /><?php print_r($option[$i]); ?>
...
=> I can't get value id option_$i ($i is a array have value 1->n) in jquery
It's because you are using:
var id = $(this).val();
That will return the value of the item, not the ID. To get the ID of (this), use
var id = $(this).attr('id');
I found a mistake in your code, is this your problem?
<script type="text/javascript">
$(document).ready(function(){
$('#btnSubmit').bind('click', function(){
$('.hiddenId').each(function(){
var id = $(this).val();
var option = $('#option_' + id).val();
if(!option){
alert('Answer empty');
return false;
}
});
)}; // <= Error?
});
</script>
Related
I've used jquery to get an "id" as a value for an input according to a dropdown value. Now the problem is, I want to use the 'id' to insert value to some other inputs. I don't know which event method to be used. For testing, I used the keyup method to check if the code works, when I manually type in a number, it works. So the problem is with the event method I choose. Please give me some suggestions.
//Get id
$(document).ready(function() {
$('#salary_eid').change(function() {
var sid = $(this).val();
var data_String = 'sid=' + sid;
$.get('search1.php', data_String, function(result) {
$.each(result, function(){
$('#can').val(this.c_id);
});
});
});
//display other information
$('#can').change(function() {
var id = $(this).val();
var data_String1 = 'id=' + id;
$.get('search.php', data_String1, function(result1) {
$.each(result1, function(){
$('#morning_rate').val(this.cMorning);
$('#night_rate').val(this.cNight);
$('#ot_rate').val(this.clientOt);
});
});
});
});
<label>Name</label>
<input type="text" name="salary_eid" />
<select id="salary_eid">
<option>opt1</option>
<option>opt2</option>
</select>
<input type="hidden" name="can" id="can" class="form-control" >
You can trigger the keyup() event from the id code, this will then work through a manual or jQuery edit,
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script>
//Get id
$(document).ready(function() {
$('#salary_eid').change(function() {
var sid = $(this).val();
$('#can').val(sid).keyup();
});
});
//display other information
$(document).on('keyup', '#can', function() {
console.log($(this).val())
});
</script>
<label>Name</label>
<input type="text" name="salary_eid" />
<select id="salary_eid">
<option>opt1</option>
<option>opt2</option>
</select>
<input type="text" name="can" id="can" class="form-control" />
If you are going to hide the second input then I might suggest using a function instead without an input,
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script>
//Get id
$(document).ready(function() {
$('#salary_eid').change(function() {
var sid = $(this).val();
display_info(sid)
});
});
//display other information
function display_info(value) {
console.log(value)
};
</script>
<label>Name</label>
<input type="text" name="salary_eid" />
<select id="salary_eid">
<option>opt1</option>
<option>opt2</option>
</select>
I have this code:
<div id = "askpost" class="row">
<input type="hidden" name="askid" id="askid" value="<?php echo $askpostid ?>">
</div>
and i want to get the id of the hidden input but when tried using this:
<script>
$(document).ready(function() {
$('input[name="iaskcomment"]').on('keyup', function(e){
e.preventDefault();
var comment = $(this).val();
var ask_id = $(this).siblings('.askid').val();
alert(ask_id); <----undefined
});
});
</script>
i even used this code :
var sid = $(this).closest("div#askpost").find("input[type='hidden']").val();
but also i get "undefined". what i wanted to do is to get the id of $askpostid
direct use $("#askid").val(). No need to use anything like siblings()
Example:-
$(document).ready(function() {
$('input[name="iaskcomment"]').on('keyup', function(e){
e.preventDefault();
var comment = $(this).val();
var ask_id = $('#askid').val();
alert(ask_id);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id = "askpost" class="row">
<input name = "iaskcomment"><br>
<input type="hidden" name="askid" id="askid" value="2">
</div>
Note:- Your code doesn't have any input with name iaskcomment. I have added in my example to just show you how it will work.So check at your end.
I have list with several inputs
<input type="hidden" id="elevens_id_ea" value="<?php echo $_GET['elev_id']; ?>" />
<input type="hidden" id="arskursen_ea" value="<?php echo $arskursen; ?>" />
<?php
if ($extraanpassning_hamta['atgard'] == true){
?>
<input name="extraanpassning" id="knapp[<?php echo $amnets_id['amne_id']; ?>]" type="button" class="btn-u rounded btn-u-red btn-sm" value="Ja">
<?php } else { ?>
<input name="extraanpassning" id="knapp[<?php echo $amnets_id['amne_id']; ?>]" type="button" class="btn-u rounded btn-u-green btn-sm" value="Nej">
<?php } ?>
The main problem is how to "catch" the value in the two latest inputs with:
id="knapp[<?php echo $amnets_id['amne_id']; ?>]"
If knapp[4] -> how do I get the 4?
The code above is a part of a button that changes value when the user presses it (without refreshing the page).
The JS
<script>
$(document).ready(function(){
$('input[type="button"]').click(function(){
var extraanpassningVal = $(this).attr("value");
var amne_id_ea = $(this).attr("id");
var elevens_id_ea = $("#elevens_id_ea").val(); //värdet av elev_id
var arskursen_ea = $("#arskursen_ea").val(); //värdet av elev_id
$.ajax({
type: "POST",
url: "iup_extraanpassning_byta.php",
data: {extraanpassningType: extraanpassningVal, amne_id_ea: amne_id_ea, elevens_id_ea: elevens_id_ea, arskursen_ea: arskursen_ea},
success: function() {
location.reload();
}
})
});
});
</script>
EDIT:
The main problem is how to get the key from a input with an id like knapp[4].
How do get the key within knapp[]?
Update (thanks to user:SpYk3HH)
<script>
$(document).ready(function(){
$('input[type="button"]').click(function(){
var key = this.id.replace(/knapp|\[|\]/g, ''), // <---They key
extraanpassningVal = $(this).attr("value"),
amne_id_ea = $(this).attr("id"),
elevens_id_ea = $("#elevens_id_ea").val(),
arskursen_ea = $("#arskursen_ea").val();
if (this.ajax) this.ajax.abort(); // helps prevent multiple ajaxing (multiclicking)
this.ajax = $.ajax({
type: "POST",
url: "iup_extraanpassning_byta.php",
data: {extraanpassningType: extraanpassningVal, amne_id_ea: amne_id_ea, elevens_id_ea: elevens_id_ea, arskursen_ea: arskursen_ea},
success: function() {
location.reload();
}
})
})
});
</script>
I think I get it? You want the key when calling the button in JS? So like say: key = this.id.replace(/knapp|\[|\]/g, '')
Update, I didn't see the brackets before
$('input[type="button"]').click(function(){
var key = this.id.replace(/knapp|\[|\]/g, ''), // <---They key
extraanpassningVal = $(this).attr("value"),
amne_id_ea = $(this).attr("id"),
elevens_id_ea = $("#elevens_id_ea").val(),
arskursen_ea = $("#arskursen_ea").val();
if (this.ajx) this.ajx.abort(); // helps prevent multiple ajaxing (multiclicking)
this.ajx = $.ajax({/* options */});
})
Does that help?
FYI, $(this).attr("id") and this.id are the same thing
$('[name=test]').each(function(i) { $('#bob').text(this.id.replace(/knapp|\[|\]/g, '')) })
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<input id="knapp4" name="test" value='my id is "knapp[4]"' />
<hr />
key: <span id="bob"></span>
Try this.
var amne_id_ea = "knapp[4]",
value = amne_id_ea.substring(amne_id_ea.lastIndexOf("[")+1,amne_id_ea.lastIndexOf("]"));
alert(value);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
Hope you are expecting this.
My form
<div class="replymsg">
<form class="mainform" action="reply.php" method="POST">
<textarea class="replytext" ></textarea>
<button data-value="<?php echo $id; ?>"
class="replybutton">Submit</button>
</form>
</div>
$id comes from a MYSQL database. The following "test" code gives me the id of the reply form using Jquery:
<script>
$(".replybutton").click(function(){
alert($(this).data("value"));
});
</script>
Value of commentid :id is not passed when I use "actual" code for the website as follows (reply:replytext ... sends message is working):
<script>
$(document).ready(function(){
$(".replybutton").click(function(){
var id = $(this).data("value");
var replytext = $(".replytext").val();
$.post("reply.php",{ commentid: id, reply: replytext },function(data){
$("#result").html(data);
});
});
});
</script>
Any ideas,any help is appreciated?
Most probably you should stop the form to submit if you are using ajax because a buttons default behavior is to submit the form:
<script>
$(document).ready(function(){
$(".replybutton").click(function(e){
e.preventDefault(); //<---------------stops the form submission here
var id = $(this).data("value");
var replytext = $(".replytext").val();
$.post("reply.php",{ commentid: id, reply: replytext },function(data){
$("#result").html(data);
});
});
});
</script>
or add a type to the button:
<button type='button' data-value="<?php echo $id; ?>" class="replybutton">Submit</button>
//------^^^^^^^^^^^^
another way is to use .submit() event:
<script>
$(document).ready(function(){
$(".mainform").submit(function(e){ //<-----pass the event here
e.preventDefault(); //<---------------still you need this
var id = $(this).find('.replybutton').data("value"); // find the elements
var replytext = $(this).find(".replytext").val(); // and here.
$.post("reply.php",{ commentid: id, reply: replytext },function(data){
$("#result").html(data);
});
});
});
</script>
and in this case you don't need to have a type to your button, but it's good to have it.
Submitting form with AJAX
In form
<div class="replymsg">
<form class="mainform" action="" method=" ">
<textarea class="replytext" ></textarea>
<input type="text" value="<?php echo $id; ?>" name="comment_id" id="comment_id" style="display: none"> <!-- this contain the ID-->
<input type="submit" class="replybutton" id="replybutton" value="Submit">
</form>
</div>
use AJAX
<script>
$(function(){
$( "#replybutton" ).click(function(event)
{
event.preventDefault();
var comment_id = $("#comment_id").val();
var replytext = $(".replytext").val();
$.ajax(
{
type:"post",
url: "./reply.php",
data:{ id:comment_id, reply:replytext,},
success:function($data)
{
$("#result").html(data);
}
});
});
});
</script>
$(document).ready(function(){
$(".replybutton").click(function(e){
e.preventDefault();
var id = $(this).data("value");
var replytext = $(this).prev().val();
$.post("reply.php",{ commentid: id, reply: replytext
},function(data){
$("#result").html(data);
});
});
});
Thanks for the help,I figured it out,my problem was sending Id and replytext in a comment/reply system when clicking replybutton. Working code above.
I am using the code below using jQuery and AJAX, to update my database.
Deletion works perfectly, but the edit function is not working. How is it possible to get the value from each input field?
<ol class="update">
<?php
$ss = mysql_query ("SELECT * FROM users_channels WHERE u_id='$uid'");
while ($chann = mysql_fetch_assoc($ss)) {
echo'
<li>
<input name="channelName" type="text" id="channelName" style="float:left; width:300px; border:1px solid #CCC;" value="'.$chann['channel_name'].'" />
<span id="rcolor">Delete</span>
<span id="gcolor">Save</span>
</li>';
}
?>
</ol>
Javascript code:
$(document).ready(function() {
$(function() {
$(".save_button").click(function() {
var id = $(this).attr("id");
var cvalue = $(this).attr("cvalue");
var dataStringe = 'id=' + id + '&cvalue=' + cvalue;
var parent = $(this).parent();
alert(cvalue);
$.ajax({
type: "POST",
url: "update_channel.php",
data: dataStringe,
cache: false,
beforeSend: function() {
parent.animate({'backgroundColor':'#fb6c6c'}, 300).animate({ opacity: 0.35 }, "slow");
},
success: function() {
//parent.slideUp('slow', function() {$(this).remove();});
}
});
return false;
});
});
});
Add this in your java script function
$(document).ready(function() {
$(function() {
$(".save_button").click(function() {
var inputVal=$("#channelName").val();
//rest of your code
return false;
});
});
});
you'll get the value of an input field(as per your question) in inputVal variable.
In order to get the values of all input fields,give them a common class name instead of giving style there like this
<input class="myInput" type="text" value="red" id="one"/>
<input class="myInput" type="text" value="France" id="two" />
and then in your javascript add this
var inputValues= {};
$(".myInput").each(function() {
inputValues[$(this).attr("id")] = $(this).val();
});
alert(inputValues.one); // "red"
you'll get the value of all input fields in inputValues variable
can u be more explicit? What do you need to get? Value of all input elements? if yes .. use $('input[name=example]').each(function(){})
this will get all values of all input with specified name
I guess what you're trying to do is submit the value of your input field as cvalue? To do this, the best approach would be:
$(".save_button").click(function() {
var id = $(this).attr("id");
var parent = $(this).parent();
var cvalue = parent.find('input').val(); // this gets the value of the <input> field
var dataStringe = 'id='+ id + '&cvalue='+ cvalue;
// the rest of your code...
});