Check chekbox when value of another element is changed - php

I want to check checkbox when value of "select" is changed. No idea what is wrong with this code, maybe you will be able to see the mistake:
var selected; var div_id;
$(".live_editor_test").focus(function() {
selected = $(this).val();
div_id = $(this).closest("div").attr('id');
});
$(".live_editor_test").blur(function() {
if (selected != $(this).val()) {
$('#live-assigning_check_' + div_id).attr('checked', true);
}
});
live_editor_test is the class of the select.
div is the row element and parent of live_editor_test.
live-assigning_check is the checkbox id.
div_id increments as there is one row for each mySql query.
Thanks in advance.
.php :
echo "<span class='content-row live-row-8' style=\"$colorcov\">";
echo "<select class=\"live_editor_test\" name=\"live_editor[$i]\" style=\"width:65px;font-size:10px;\">";
echo "<option value=\"\" selected></option>";
foreach ($storage_access->userAuth($row1, $where) as $row45)
{
if ($row45->match_id > '0') { $selected = "selected"; } else { $selected = ""; }
echo "<option value=\"$row45->user_id\" $selected>$row45->user_name</option>";
}
echo "</select>";
echo "</span>";
echo "<span style=\"width:20px;display:table-cell;\"><input class='checkbox-row' id='live-assigning_check_$i' type='checkbox' name='checked[$i]' ></span>";

Use .prop() instead of .attr(). Also use change event for select box.
Note: assuming that '#live-assigning_check_' + div_id evaluates to valid checkbox id.
$(".live_editor_test").change(function() {
if (selected != $(this).val()) {
$('#live-assigning_check_' + div_id).prop('checked', true);
}
});

Related

Disable select option when other specifig value is selected

I have a question by these given information:
private function loadIntervallOptions($intervallid = 1, $intervallfactor=1){
echo "<select name='intervallfactor'>";
for($intervallnumber=1;$intervallnumber<10;$intervallnumber++){
$checked = "";
if($intervallnumber== $intervallfactor){
$checked = "selected";
}
echo "<option $checked>$intervallnumber</option>";
}
echo "</select>";
echo "<select name='intervallid'>";
for($i=0;$i<count($this->todo_intervall);$i++){
echo "<option value='{$this->todo_intervall[$i]->getintervallid()}' ";
if($this->todo_intervall[$i]->getIntervallid() == $intervallid){
echo "selected";
}
echo ">{$this->todo_intervall[$i]->getIntervall()}</option>";
}
echo "</select>";
}
What I want to do:
If intervallid=1 I want to hide the select 'intervallfactor'. Is this possible?
Thank you in advance!
EDIT:
I'm trying this but it won't work
$('.intervallid').change(function(e) {
if ($('.intervallid').val()==1){
$('.intervallfactor').attr('disabled','disabled');
}
else{
$('.intervallfactor').removeAttr('disabled');
}
});
$('.intervallid').trigger('change');
You are trying to reference the html element using a class name .intervallid which doesnt exist.
either you should use $('select[name="intervalid"]) or add an id to the select from php and, use that to reference the element.
PHP
echo "<select name='intervallid' id='intervall_id'>";
JS
$('#intervall_id').attr('disabled', 'true')

Creating combobox and checkboxes with jQuery and CodeIgniter

I have combobox named catid, which is filled with categories. On change, I am filling the content on other
2 comboboxes and I am adding checkboxes in my form, which are all based on selected category.
So three comboboxes in total, categories (#catid), subcategories (#catid2) and manufacturers (#manufacturerid)
in this order.
When there are no subcategories, everything is nice and smooth. In the subcategory combobox, i get the message
there are no subcategories, i am filling the manufacturers combobox with manufacturers from that category,
and i am drawing the comboboxes again related to this category.
Problem arise when sub category exist. I am trying using on change event to fetch my checkboxes, related to that subcategory.
I get undefined value.
Here is my code:
Controller:
public function __construct() {
parent::__construct();
$this->load->model('addsCategoriesModel');
$this->load->model('addsTypesModel');
$this->load->model('colorsModel');
$this->load->model('geographicAreasModel');
$this->load->model('categoriesFiltersModel');
}
// function index has been ommited for the sake of simplicity
function get_dropdown_values($catid){
$this->load->model('manufacturersModel');
$this->db->select('manufacturerid,manufacturername');
$this->db->where("catid = $catid");
$result = $this->manufacturersModel->get();
//echo form_dropdown('manufactirerid', $result, NULL, 'id="manufacturerid"');
echo "<select name='manufacturerid' id='manufacturerid' class='styled_select'>";
//"<option value=".$result[]['manufacturerid'].">".$result[]['manufacturername']
foreach ($result as $key=>$value) {
echo "<option value=".$key['manufacturerid'].">".$value['manufacturername']."</option>";
}
echo "</select>";
}
function get_dropdown_values2($catid){
// create the second drop down, where parent id is the selected category
$this->db->select('catid,parentid,categoryname');
$this->db->where("parentid = $catid");
$result2 = $this->addsCategoriesModel->get();
if(count($result2) > 0){
echo "<select name='catid2' id='catid2' class='styled_select'>";
foreach ($result2 as $key=>$value) {
echo "<option value=".$key['catid'].">".$value['categoryname']."</option>";
}
echo "</select>";
} else {
echo "<select name='catid2' id='catid2' class='styled_select'>";
echo "<option value='0'>No subcategories</option>";
echo "</select>";
}
}
function get_categories_filters($catid3){
// create the checkboxes according to selected category
// case 1: if the category id is NOT 4
$this->db->where("catid = $catid3");
$result3 = $this->categoriesFiltersModel->get();
if(count($result3) > 0){
// start the foreach loop
foreach($result3 as $key=>$value){
echo "<div class='chb_group'>";
echo "<span class='custom_chb_wrapper'>";
echo "<input type='checkbox' name=" .$value['filterid'] ." class='zcheckbox'/>";
echo "<label>" .$value['filtername']. "</label>";
echo "</span>";
echo "</div>";
}
} else {
$result3 = "No checkboxes in this category";
echo $result3;
//$this->get_categories_filters2(22);
}
}
function get_categories_filters2($catid4){
// create the checkboxes according to selected category
$this->db->where("catid = $catid4");
$result4 = $this->categoriesFiltersModel->get();
if(count($result4) > 0){
// start the foreach loop
foreach($result4 as $key=>$value){
echo "<div class='chb_group'>";
echo "<span class='custom_chb_wrapper'>";
echo "<input type='checkbox' name=" .$value['filterid'] ." class='zcheckbox'/>";
echo "<label>" .$value['filtername']. "</label>";
echo "</span>";
echo "</div>";
}
} else {
//$result4 = "No checkboxes in this category";
$result4 = "Are you in filters2??";
echo $result4;
}
}
}
Here is my view:
<select name="catid" id="catid" class="styled_select" onchange="load_dropdown_content($('#manufacturerid'), this.value);load_dropdown_content2($('#catid2'), this.value);load_dropdown_content3($('#catid3'), this.value);">
<option value="0">Please select</option>
<?php
// foreach loop to fetch the categories
foreach ($adds_categories as $category){
echo "<option value=".$category['catid'].">".$category['categoryname']."</option>";
}
?>
</select>
</div>
<div class="select_wrapper">
<label><strong>Subcategory: </strong></label>
<select name="catid2" id="catid2" class="styled_select" onchange="load_dropdown_content4($('#catid3'), this.value);">
<option value="0">Please select</option>
</select>
</div>
For the sake of simplicity, I am not showing here the manufactirer combobox, with which i have no problem whatsoever and the checkboxes
And the javascript:
<script type="text/javascript">
function load_dropdown_content(field_dropdown, selected_value){
var result = $.ajax({
'url' : '<?php echo site_url('submit/get_dropdown_values'); ?>/' + selected_value,
'async' : false
}).responseText;
field_dropdown.replaceWith(result);
}
function load_dropdown_content2(field_dropdown, selected_value){
var result2 = $.ajax({
'url' : '<?php echo site_url('submit/get_dropdown_values2'); ?>/' + selected_value,
'async' : false
}).responseText;
field_dropdown.replaceWith(result2);
}
function load_dropdown_content3(field_dropdown, selected_value){
if(selected_value == 4){
load_dropdown_content4();
}
var result3 = $.ajax({
'url' : '<?php echo site_url('submit/get_categories_filters'); ?>/' + selected_value,
'async' : false
}).responseText;
$('#catid3').empty(); // DIV CATID3 IS THE DIV WHERE CHECKBOXES ARE CREATED
$("#catid3").append(result3);
}
function load_dropdown_content4(field_dropdown, selected_value){
var result4 = $.ajax({
'url' : '<?php echo site_url('submit/get_categories_filters2'); ?>/' + selected_value,
'async' : false
}).responseText;
$('#catid3').empty(); // DIV CATID3 IS THE DIV WHERE CHECKBOXES ARE CREATED
$("#catid3").append(result4);
alert(result4);
}
</script>
If anyone can help me to overcome that undefined error which I am getting from subcategories combobox, I will deeply appreciated.
Regards...
Instead of $("$cat3"), you can do like below also.
onchange = 'load_dropdown_content4("cat3",this.value)'
In load_dropdown_content4
function load_dropdown_content4(field_dropdown, selected_value)
{
//replace field_dropdown.replaceWith(result2);
$("#"+field_dropdown).replaceWith(result2);
}
Try this code.

How to Set a Dropdowns Default Selection Based on the Logged in User

I have a dropdown control which and I would like it to default to a specific option based on the access of the logged in user. For example, the dropdown has 10 options but only administrators have access to view all 10 options. The majority of users only have access to 1 of the options though. The page contents are hidden/displayed based on whether or not the value of the dropdown is null.
Question: Using the example above, if an admin is logged in I need the dropdown to default to "Select an option". This way the page content is hidden. On the other hand, if a user with access to only 1 is logged in, I need it to default to that 1. This way they don't have to select anything and, by default the page content is displayed. How do I go about doing this?
Below is my current code which handles what the dropdown displays based on when a selection is made.
PHP/HTML
// Hide/Show main content div
<?php
if (isset($_GET['src'])) {
$src = $_GET['src'];
} else {
?>
<style>
#divmain { display: none; }
</style>
}
<?php } ?>
// Start of form, header, etc.
<select name="select1" id="select1">
<?php
$sql = getOptions();
$data = makeConnection($sql);
if ($src == null) { // If value is null, default to 'Select an option'
echo "<option selected value=\"\" disabled=\"disabled\">--Select an option--</option>";
while ($row = odbc_fetch_array($db)) {
echo "<option value=\"".$row['content']."\">".$row['content']."</option>";
}
} else { // If value not null keep the selected value selected
while ($row = odbc_fetch_array($db)) {
if ($row['content'] == $src) { $selected = " selected "; }
else { $selected = " "; }
echo "<option value=\"".$row['content']."\" ".$selected.">".$row['content']."</option>";
}
}
?>
</select>
JS
// Pass selected value on change
$('#select1').change(function() {
var sel = $(this).val();
location.href = "page1.php?src=" + sel;
}
SQL
// Hardcoding user for testing purposes, THIS WILL BE CHANGED
function getOptions() {
$results = "SELECT content, userid FROM table WHERE userid = 'username'";
return $results;
}
Any help is much appreciated and please let me know if I'm not clear about anything.
Got some help and have it figured out now. Here is the revised code:
PHP/HTML
// Hide/Show main content div
<?php
$src = null;
if (isset($_GET['src'])) {
$src = $_GET['src'];
} else {
?>
<style>
#divmain { display: none; }
</style>
}
<?php } ?>
// Start of form, header, etc.
<select name="select1" id="select1">
<?php
$sql = getOptions();
$data = makeConnection($sql);
if ($src == null) {
$i = 0;
$content = "";
while ($row = odbc_fetch_array($db)) {
$content .= "<option value=\"".$row['content']."\">".$row['content']."</option>";
$i++;
}
if ($i > 1) {
echo "<option selected value=\"\" disabled=\"disabled\">--Select an option--</option>";
}
echo $content;
if ($i > 1) { $oneopt = 1; }
else { $oneopt = 0; }
} else {
while ($row = odbc_fetch_array($db)) {
if ($row['content'] == $src) { $selected = " selected "; }
else { $selected = " "; }
echo "<option value=\"".$row['content']."\" ".$selected.">".$row['content']."</option>";
}
}
?>
</select>
JS
$('#select1').change(function() {
var sel = $(this).val();
location.href = "page1.php?src=" + sel;
}
<?php
global $optone;
if ($optone == 1) {
echo "$('#select1').trigger('change');";
}
?>
SQL -- Stays the same
#chenasraf really appreciate the help! Hope this can be of some help to someone in the future!
The preselected option is always the first to have a "selected" attribute. Your first disabled one has it first on all cases, so it's always chosen. Remove that and work from there.
On a side note, I think you can manage to make this options part work better. I've taken the liberty of rewriting it for you:
<select name="select1" id="select1">
<?php
$selected = '';
while ($row = obdc_fetch_array($db)) {
$options[] = '<option value="'.$row['content'].'">'.$row['content'].'</option>';
if ($row['content'] == $src)
$selected = count($options) - 1;
}
array_unshift($options, '<option disabled="disabled"', $selected == '' ? ' selected="selected"' : '','>--Select an option--</option>');
foreach ($options as $option) {
echo $option;
}
?>
</select>

jQuery Sortable PHP

I am using jQuery sortable to manipulate image order and write to a DB. That functionality works well.
PHP
echo "<div class='revisionNum'>";
echo "<ul id='sortable_" . $count ."'>";
while($row = mysql_fetch_array($result)) {
$sortImageName = $row['OrgImageName'];
$sortPath = "../data/gallery/" . $galleryID . "/images/album/" . $sortImageName;
echo "<li class='sortPhotos' id='item_{$row['id']}' >";
echo '<img class="sortImage" src="'. $sortPath .'"/>';
echo "<p>" . $sortImageName . "</p>";
echo "</li>";
}
echo "</ul>";
echo "</div>";
jQuery
//make sortable
$(".revisionNum").each(
function(e) {
num = e + 1;
$("#sortable_" + num).sortable(
{stop:function(i) {
serial = $("#sortable_" + num).sortable("serialize");
$.ajax({
type: "GET",
url: "../albumUploader/queries/sort.php",
data: serial
});
},
opacity:1.0,
//cursor: move
});
});
MYSQL
foreach($_GET['item'] as $key=>$value) {
mysql_query(" UPDATE galleryimage
SET sort = '{$key}'
WHERE id = '{$value}'
");
}
The issue is when I have multiple <div class=''revisionNum> i am only grabbing the serial = $("#sortable_" + num) of the last UL if the [.revisionNum], not the actual UL that I am sorting. Thanks for the help on this. Let me know if further clarification is needed.
I am not sure I fully understand your question, but I think you are looking for the following:
The variable num will change every loop you make in the each-loop. But at the end it will have the value of the last loop. Because num seems to be a global variable you can't call it in the stop function. Then it will just use the last value it had. The value of the last loop. (Explains your problem)
To solve this I recommend to change your code to:
$(".revisionNum").each(
function(e) {
$(this).children("ul").sortable(
{stop:function(i) {
num = $(this).children("ul").attr("id").replace("sortable_", "");
serial = $(this).children("ul").sortable("serialize");
...
$(this) refers to the $(".revisionNum") you are looping through and it will be remembered, also in the stop function.

Option on dropdown as anchor

I am pulling out record from the database and inserting them inside a dropdown like this:
echo "<select>";
while ($drow = mysql_fetch_assoc($request))
{
echo "<option>" . $drow['id'] . "</option>";
}
echo "</select>";
It works but I need to be able to click on an option on the dropdown and make it link just like:
Record1Here
Record2Here
Record3Here
UPDATE: Latest code:
<script>
function doSomething() {
var currentval = this.options[this.selectedIndex].value;
// you could navigate away at that point ?
window.location = currentval;
}
</script>
...
echo "<select onchange='doSomething();'>";
while ($drow = mysql_fetch_assoc($request))
{
echo "<option value=\"view.php\">" . $drow['id'] . "</option>";
}
echo "</select>";
You can't place anchors on an option within a select list.
What you can do is use JavaScript and then do something on the change event of the select list :
echo "<select onchange='doSomething(this);>';
then in JavaScript do something based on the selected value :
function doSomething(elem) {
var currentval = elem.options[elem.selectedIndex].value;
// you could navigate away at that point ?
window.location = currentval;
}
Example here
you could update your PHP code to include a value in each option :
echo "<option value=\"urlhere.php\">" . $drow['id'] . "</option>";

Categories