This question already has answers here:
Only one selected checkbox
(9 answers)
Closed 2 years ago.
I have the following:
<input type="checkbox" value="Spanish" <?php if($_GET['set'] == 'Spanish') echo 'checked'; ?> onclick="filter(this)" id="spanish">
<input type="checkbox" value="English" <?php if($_GET['set'] == 'English') echo 'checked'; ?> onclick="filter(this)" id="english">
<input type="checkbox" value="French" <?php if($_GET['set'] == 'French') echo 'checked'; ?> onclick="filter(this)" id="french">
function get_url() {
var urlPrefix = '<?php echo site_url('home/language?'); ?>'
var urlSuffix = "";
var slectedCategory = "";
$('#spanish:checked').each(function() {
slectedCategory = $(this).attr('value');
});
$('#english:checked').each(function() {
slectedCategory = $(this).attr('value');
});
$('#french:checked').each(function() {
slectedCategory = $(this).attr('value');
});
urlSuffix = "set="+slectedCategory;
var url = urlPrefix+urlSuffix;
return url;
}
function filter() {
var url = get_url();
window.location.replace(url);
}
The problem that occurs is that when I select the first option (spanish) it works, if I check the second option it also works (english). But if I try to check the previous option again (spanish) it doesn't work.
What can it be? It seems that it works only by going down.
The problem is occurring because you didn't work with the value of the clicked checkbox to generate new url in get_url function. Replace your js functions like below. It will work.
function get_url(elem) {
var urlPrefix = '<?php echo site_url('home/language?'); ?>'
var urlSuffix = "";
var slectedCategory = "";
slectedCategory = $(elem).attr('value');
urlSuffix = "set="+slectedCategory;
var url = urlPrefix+urlSuffix;
return url;
}
function filter(elem) {
var url = get_url(elem);
window.location.replace(url);
}
Related
I have this field
<input class="red-heart-checkbox " name="photo[]" type="checkbox" value="<?php echo $id; ?>" id="<?php echo $id; ?>" data-img="<?php echo $imageURL; ?>"/>
And I would like to make a list of image with url image from the data-img checked but I only have values with this code :
<script>
$(function() {
var masterCheck = $("#masterCheck");
var listCheckItems = $("#devel-generate-content-form :checkbox");
masterCheck.on("click", function() {
var isMasterChecked = $(this).is(":checked");
listCheckItems.prop("checked", isMasterChecked);
getSelectedItems();
});
listCheckItems.on("change", function() {
var totalItems = listCheckItems.length;
var checkedItems = listCheckItems.filter(":checked").length;
if (totalItems == checkedItems) {
masterCheck.prop("indeterminate", false);
masterCheck.prop("checked", true);
}
else if (checkedItems > 0 && checkedItems < totalItems) {
masterCheck.prop("indeterminate", true);
}
else {
masterCheck.prop("indeterminate", false);
masterCheck.prop("checked", false);
}
getSelectedItems();
});
function getSelectedItems() {
var getCheckedValues = [];
getCheckedValues = [];
listCheckItems.filter(":checked").each(function() {
getCheckedValues.push($(this).val());
});
$("#selected-values").html(JSON.stringify(getCheckedValues));
}
});
</script>
My result is on :
<li class="list-group-item" id="selected-values"></li>
And looks like this :
Is it possible to have url image instead of the value , or use the result with de database to have url image ?
Thanks a lot !
Two solutions in my opinion,
The one you already suggested, i.e. use a db call
try passing imageURL in value
I'm using this script:
<textarea id="textareabox">
<span id="correcto"></span>
<span id="incorrecto"></span>
<script type="text/javascript">
function validateform() {
var textarea = document.getElementById('textareabox');
var word = 'this is the answer';
var word2 = "This could be the answer aswell";
var textValue = textarea.value.toLowerCase();
if (textValue.indexOf(word) != -1) {
document.getElementById("correcto").innerHTML = "this is the answer";
return true;
}
if (textValue.indexOf(word2) != -1) {
document.getElementById("correcto").innerHTML = "This could be the answer aswell";
return true;
} else {
document.getElementById("incorrecto").innerHTML = 'Incorrect!';
}
}
</script>
The scripts loop through 2 custom fields:
answer1
answer2
if the answer is not correct it will say incorrect!
But with this script I can only have 2 answers, I change this by adding an extra answer button, answer3 or answer4 but this is not desirable.
I rather have the script to loop through every row in answer1:
Answer1:
this is the answer
this could be the answer well
also this
and this
this
and again this could be
And if there are no more rows it says Incorrect! this way I can add way more answers.
But I don't know where to start for this, can only create extra "If"'s Im calling the custom field in the PHP from, so how does the javascript know it are extra's rows and not a complete answer 4 lines? How can I let javascript loop through the rows.
Could someone help me on my way?
In this script I'm using custom fields
This is the real script I'm using, but i want it to loop through rows until no line is left and then say incorrect!
<script type="text/javascript">
<?php global $outputvali_of_this_page; ?>
<?php global $answerbutton2_of_this_page; ?>
function validateform() {
s = document.getElementById("textareabox").value;
s = s.replace(/(^\s*)|(\s*$)/gi,"");
s = s.replace(/[ ]{2,}/gi," ");
s = s.replace(/\n /,"\n");
document.getElementById("textareabox").value = s;
var textarea = document.getElementById('textareabox');
var word = '<?php echo $answerbutton_of_this_page; ?>';
var word2 = "<?php echo $answerbutton2_of_this_page; ?>";
var textValue = textarea.value.toLowerCase();
if (textValue.indexOf(word) != -1) {
document.getElementById("correcto").innerHTML = <?php echo json_encode($outputvali_of_this_page); ?>;
return true;
}
if (textValue.indexOf(word2) != -1) {
document.getElementById("correcto").innerHTML = <?php echo json_encode($outputvali_of_this_page); ?>;
return true;
} else {
document.getElementById("incorrecto").innerHTML = 'Incorrect!';
}
}
</script>
Website for more:
https://www.baswijdenes.com/powershell/using-help-system-powershell-practice-1-0/using-the-help-system-powershell-practice-1-2/
I was making an image gallery with up and down buttons ,the array $imageids contains all image ids. I want to access these values with
JavaScript as follows,
PHP :
require"./connect.php";
$imgquery = mysql_query("SELECT * FROM press INNER JOIN subscriptions ON press.userid=subscriptions.to_u WHERE subscriptions.from_u='30' ORDER BY press.id DESC ");
$countrow = mysql_num_rows($imgquery);
$imageids = array();
while($fimgq = mysql_fetch_assoc($imgq)) {
$imgid = $fimgq['id'];
array_push($imageids,$imgid);
}
JavaScript:
$(document).ready(function() {
var i = -1;
var cr = <?php echo $countrow ?>;
$('#down').click(function() {
if (i < cr-1) {
i = i + 1;
var ard = <?php echo $imageids[i]?>;
alert(ard);
}
});
$('#up').click(function() {
if(i>0) {
i = i - 1;
var aru = <?php echo $imageids[i]?>;
alert(aru);
}
});
});
I want to get $imageids elements by putting a javascript variable i inside $imageids[] array , like
var ard = <?php echo $imageids[i]?>;
alert(ard); // Which doesn't work
As #chris85 and #Khalos pointed out in comments, the PHP variables are all dead once the JavaScript runs, so you need to output all the ID:s into an JavaScript array. It would looke something like this:
$(document).ready(function(){
var i=-1;
var cr= <?php echo $countrow ?>;
//Save all the ID:s to a JS variable so they can be used later.
var imageids = [<?php echo implode(',', $imageids); ?>];
$('#down').click(function(){
if(i<cr-1) {
i=i+1;
alert(imageids[i]); //This uses the JS variable imageids, not the dead PHP one.
}
});
$('#up').click(function(){
if(i>0) {
i=i-1;
alert(imageids[i]); //Same as above.
}
});
});
I have the following:
PHP/HTML CODE:
<?php
$c = 1;
foreach($this->contactos as $contacto){
?>
<div class="uk-form-row">
<label for="contactopadrino<?php echo $c; ?>" class="uk-form-label"><?php echo $contacto->email; ?></label>
<input class="contactopadrinos" name="contactopadrino[]" id="contactopadrino<?php echo $c; ?>" type="checkbox" value="<?php echo $contacto->email; ?>" />
</div>
<?php
$c++;
}
?>
jQuery CODE:
function validarEnviarDescuento(){
$('#errorofertacontainerdescuento').css('display','none');
$('#errorofertadescuento').html('');
var validar = 0;
var vacio = 0;
for(var e=1; e<6; e++){
var email = $("#email_contactopadrino"+e).val();
if(!validarEmail(email) && email != ''){
validar++;
}
if(email != ''){
vacio++;
}
}
if(!vacio){
$('input:radio:checked').each(function () {
var $this = $(this);
if ($(this).prop('checked')) {
return true;
}
});
$('#errorofertadescuento').append('<li>' + '<?php echo JText::_('COM_CSTUDOMUS_ERROR_SIN_SELECCIONAR'); ?>' + '</li>');
$('#errorofertacontainerdescuento').css('display','block');
return false;
}
if(validar){
$('#errorofertadescuento').append('<li>' + '<?php echo JText::_('COM_CSTUDOMUS_ERROR_EMAIL_INCORRECTO'); ?>' + '</li>');
$('#errorofertacontainerdescuento').css('display','block');
return false;
}
else{
return true;
}
}
Im trying to go through each input and if one is checked it should return true and submit but what I have done is not working.
You don't need to use each. instead use cobination :checked and length
return $('input:checkbox:checked').length;
It will return true if anyone of the checkbox button has checked
You can use :checked with selector to get all radio buttons those are checked.
$('input:radio:checked')
Description: Matches all elements that are checked or selected, jQuery docs
If you want to check if atleast one radio is checked then you can use length
if($('input:radio:checked').length)
{
}
For iterating through checked radio you can use each
$('input:radio:checked').each(function(){
alert(this.value);
});
<?php
$i = 1;
$query1 = mysql_query("SELECT * FROM `alert_history` ORDER BY `alert_history`.`id` DESC LIMIT ".$start.",".$per_page."");
while($result = mysql_fetch_array($query1)){
echo '<td colspan = "2"><form method = "POST" onsubmit = "submitform()" ><textarea onFocus = "myFunction(1)" onBlur = "myFunction(0)" id = "comment'.$i.'" name = "comment"></textarea> <br />';
echo '<input type = "text" id = "alertid'.$i.'" name = "alertid" value = "'.$result['id'].'">';
echo '<input type = "submit" name = "submit" value = "Comment" ></form></td>';
$i++;
}
?>
<script>
function submitform(){
var comment = $("#comment").val();
var alertid = $("#alertid").val();
alert(comment);
$.ajax({
type: "POST",
url: "analytic.php",
data:{cmt:comment,alert_id:alertid}
});
//return false;
}
</script>
How to get textarea tag and input tag id for javascript function ?
Both tag show in while loop so i want every textarea and input tag has different id.
If you generate dynamic id in text box that time if change something in text box that time store it's id in local variable and use it on in your code
<input type = "text" class="textBox" id = "alertid'.$i.'" name = "alertid" value = "'.$result['id'].'">';
var Id
$(document).on('change', "input.textBox", function () {
Id = $(this).attr("id");
alert(Id )
});
Hope this code can help you..
In jQuery, select the tag and use the .each():
$("textarea").each(function(){
alert($(this).attr("id"));
alert($(this).val());
});
$("input").each(function(){
alert($(this).attr("id"));
alert($(this).val());
});
Demo here (Client side).
so first you set the different IDs and then you fetch it.
var textAreaId = $('textarea').prop('id);
var inputId = $('input').prop('id);
Update
$i is constant for every single set of textarea and input combined together.
If you want to grab every set of textarea and input, you should rather assign the ID to instead of doing it for every textarea and input element.
<?php
$i = 1;
$query1 = mysql_query("SELECT * FROM `alert_history` ORDER BY `alert_history`.`id` DESC LIMIT ".$start.",".$per_page."");
while($result = mysql_fetch_array($query1)){
echo '<td colspan ="2" id='.$i.'"><form method = "POST" onsubmit = "submitform()" ><textarea onFocus = "myFunction(1)" onBlur = "myFunction(0)" name = "comment"></textarea> <br />';
echo '<input type = "text" name = "alertid" value = "'.$result['id'].'">';
echo '<input type = "submit" name = "submit" value = "Comment" ></form></td>';
$i++;
}
?>
<script>
function submitform(){
var comment = $(this).closest('td').find('textarea').val();
var alertid = $(this).parent().prop('id');
alert(comment);
$.ajax({
type: "POST",
url: "analytic.php",
data:{cmt:comment,alert_id:alertid}
});
//return false;
}
</script>
Try this one:
(See JsFiddle working demo)
<?php
$i = 1;
$query1 = mysql_query("SELECT * FROM `alert_history` ORDER BY `alert_history`.`id` DESC LIMIT ".$start.",".$per_page."");
while($result = mysql_fetch_array($query1)){
echo '<td colspan = "2"><form method = "POST" onsubmit = "submitform(this)" ><textarea onFocus = "myFunction(1)" onBlur = "myFunction(0)" id = "comment'.$i.'" name = "comment"></textarea> <br />';
echo '<input type = "text" id = "alertid'.$i.'" name = "alertid" value = "'.$result['id'].'">';
echo '<input type = "submit" name = "submit" value = "Comment" ></form></td>';
$i++;
}
?>
<script>
function submitform(form){
var comment = $(form).find("textarea").val();
alert(comment);
var alertid = $(form).find("input[name=alertid]").attr("id");
alert(alertid);
//Or if you mean:
var alertid = $(form).find("input[name=alertid]").val();
alert(alertid);
$.ajax({
type: "POST",
url: "analytic.php",
data:{cmt:comment,alert_id:alertid}
});
//return false;
}
</script>