Option on dropdown as anchor - php

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>";

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')

Change background color of specific select element in a list of procedurally generated select elements

I am trying to use jQuery to change the background color of the select element based on the option chosen within.
To generate the select elements, I'm using the following code:
while ($qrow = $qquery->fetch(PDO::FETCH_ASSOC)) {
$aqanswer = "qAnswer" . $qrow['questionID'] . "";
$aqcomments = "qComments" . $qrow['questionID'] . "";
echo "<tr><td class='auditf'>" . $qrow['qDesc'] . "</td><td class='auditm'><select name='qAnswer" . $qrow['questionID'] . "' form='entryform' id = 'selectqAnswer". $qrow['questionID'] ."'>";
if (isset($_SESSION[$aqanswer])) {
if ($_SESSION[$aqanswer] === 'Green') {
echo "<option value='Green' selected='true' class = 'green'>Green</option>";
echo "<option value='Red' class='red'>Red</option>";
} elseif ($_SESSION[$aqanswer] === 'Red') {
echo "<option value='Green' class ='green'>Green</option>";
echo "<option value='Red' selected='true' class = 'red'>Red</option>";
}
unset($_SESSION[$aqanswer]);
} else {
echo "<option value='Green' selected='true' class = 'green'>Green</option>";
echo "<option value='Red' class = 'red'>Red</option>";
}
echo "</select></td><td class='auditl'><textarea name='qComments" . $qrow['questionID'] . "' rows='3' cols='30' maxlength='255' value='N/A'>";
if (isset($_SESSION[$aqcomments])) {
echo $_SESSION[$aqcomments];
unset($_SESSION[$aqcomments]);
} else {
}
echo "</textarea></td></tr>";
}
And my jQuery:
$("[id^=selectqAnswer]").change(function () {
var color = $("option:selected", this).attr("class");
$("[id^=selectqAnswer]").attr("class", color);
});
Now this does work, but it causes every single box on the page to change, obviously. The problem is, the number of boxes on the page can change based on user options, so I don't have a fixed list of select IDs that I could reference individually in my jQuery. I've tried Googling the issue, but every single result talks about specifically naming the ID, not working with an ID that's generated procedurally. How do I only change a specific select element's background color based on the select option selected when I don't know what the ID will specifically be ahead of time.
$("[id^=selectqAnswer]").attr("class", color);
this will change the color for every #selectqAnswer select, if you want to change the color of the current select use this
Javascript
$(this).attr("class", color);

jQuery toggle() on array of mysql fetched arrray

I have a fetched with php as an array and it is categorized. See code:
<table><?php
$cat_set = get_all_cats();
while($category = mysql_fetch_array($cat_set)){
if($category["category"] != "no-cat"){
echo "<tr colspam=\"2\"><td></td><td id=\"cats\">".$category["category"]."<td><img id=\"blink\" src=\"drop.png\"></td></td></tr>";
$course_set = get_courses_for_cats($category["cat_id"]);
while ($course = mysql_fetch_array($course_set)) {
echo"<tr class=\"cont\"><td><input value = ". $course["course_code"] ." name=\"boxes[]\" type=\"checkbox\"></td><td class=\"code\">" . $course["course_code"] . "</td></tr></input>";
}
}
else {
$course_set = get_courses_for_cats($category["cat_id"]);
while ($course = mysql_fetch_array($course_set)) {
echo"<tr class=\"cont\"><td><input value = ". $course["course_code"] ." name=\"boxes[]\" type=\"checkbox\"></td><td class=\"code\">" . $course["course_code"] . "</td></tr></input>";
}
}
}
?>
</table>
So every course has a categoty.
Now what I want to do is to use jquery to hide the course unless its category is clicked an this is what i have achieved
<script>
$(document).ready(function(){
$(".cont").hide();
$("#cats").click(function(){
$(".cont").toggle();
});
})
</script>
but it when i click the category it hides all the courses even those that does not belong to itself. I know if the categories had different ids it would have been better but because it is an array, one id serves them all. Please any idea on how i can fix this. Thanks
Use event Delegation you add the dom elments dynamically using php
$(document).ready(function(){
$(".cont").hide();
$(document).on("click" , "#cats" , function(){
$(".cont").toggle();
});
})
Try this one.
<table>
<?php
$cat_set = get_all_cats();
while($category = mysql_fetch_array($cat_set)){
if($category["category"] != "no-cat"){
echo "<tr colspam=\"2\"><td></td><td id=\"cats\" catid='".$category["cat_id"]."'>".$category["category"]."</td><td><img id=\"blink\" src=\"drop.png\"></td></tr>";
$course_set = get_courses_for_cats($category["cat_id"]);
while ($course = mysql_fetch_array($course_set)) {
echo"<tr class='cont cont".$category["cat_id"]."><td><input value = ". $course["course_code"] ." name=\"boxes[]\" type=\"checkbox\"></td><td class=\"code\">" . $course["course_code"] . "</td></tr></input>";
}
}
else {
$course_set = get_courses_for_cats($category["cat_id"]);
while ($course = mysql_fetch_array($course_set)) {
echo"<tr class='cont cont".$category["cat_id"]."><td><input value = ". $course["course_code"] ." name=\"boxes[]\" type=\"checkbox\"></td><td class=\"code\">" . $course["course_code"] . "</td></tr></input>";
}
}
}
?>
</table>
JavaScript
<script>
$(document).ready(function(){
$(".cont").hide();
$("#cats").click(function(){
$(".cont"+$(this).attr('catid')).toggle();
});
})
</script>
Look for syntax errors if any.
"Well the category row i gave an attribute called data-show="{categoryName}" and then each row for that category i gave an attribute data-cat="{categoryName}"
What then the JQuery does when you click on the category it finds the value of its data-show attribute it then toggles all of the elements with a data-cat attribute that is equal to the data-show attribute"
Click for the jsfiddle.net sollution
Helped by cdcoding
<script>
$(document).ready(function(){
$(".cont").hide();
$("[data-show]").click(function(){
var selector = $(this).attr("data-show");
$("[data-cat='"+selector+"']").toggle();
});
});
</script>

selected option in select dissappears on reload

Once it loads in my page, if nothing has been saved in the DB table, all options are shown. As soon as i make a selection and reload the page, the selected option dissapears from the list and isn`t reloaded in the dropdown. Instead, it displays the next value which takes the place of the selected one.
if i check the SQL statement and the $str, it does load all the options except the one which is selected which is in $getBris (it has a value).
What could be causing my select to not display my selected option and instead removing it from the list?
*It specifically doesnt work in IE8, wasnt working in Firefox but now it does
<script src="validation.js" type="text/javascript"></script>
<html>
<body onLoad="checkSecondValue();">
</body>
</html>
<?php
//retrieve all the bris for the drop down
include '../../inc/database.php';
// ORDER BY RAND()
$res = BbqcDatabase::getInstance()->doQuery('SELECT * FROM T_TOURNOI_BRIS');
$str = "<select name='ddlBrisSelected' id='ddlBrisSelected' onChange='checkSecondValue()'>";
$getBris = $_GET['bris'];
$getBris = $getBris - 1;
print_r("bris is : "+ $getBris);
if($getBris == null)
{
$str .= "<option value='' selected></option>";
}
else
{
$str .= "<option value='999'>Choisir un bris</option>";
}
$i = 0;
while($data = mysql_fetch_assoc($res))
{
if($data['F_BRISID'] == $getBris)
{
$str .= "<option value='" . $data['F_BRISID'] . "' selected '>" . $data['F_BRISTITLE'] . "</option>";
}
else
{
$str .= "<option value='" . $data['F_BRISID'] . "'>" . $data['F_BRISTITLE'] . "</option>";
}
$i++;
}
if($getBris == 12)
{
$str .= "<option value=12 selected>Autre</option>";
}
else
{
$str .= "<option value=12>Autre</option>";
}
$str .= "</select>";
echo $str;
if(is_numeric($bris))
{
echo "<script type=\"text/javascript\">alert('test');checkSecondValue();</script>";
}
?>
Use your browser's View Source feature to inspect the actual HTML you are generating (which is, in fact, the only see the browser ever sees). It looks like you're inserting random single quotes.
Update:
<option value='" . $data['F_BRISID'] . "' selected '>" . $data['F_BRISTITLE'] . "</option>"
... will render as:
<option value='blah' selected '>blah</option>
It's the only error I've cared to spot but an HTML validator should find them all. Also, I recommend you use this syntax:
<option value="blah" selected="selected">blah</option>
A construct like this
if($getBris == 12)
{
$str .= "<option value=12 selected>Autre</option>";
}
else
{
$str .= "<option value=12>Autre</option>";
}
is highly wasteful of space and forces you to duplicate a big chunk of html whose only difference is the "selected" attribute. Why not do something like this:
$selected = ($getBris == 12) ? ' selected' : '';
$str .= "<option value=12{$selected}>Autre</option>";

Calling a JS function in PHP

I know it`s possible to call javascript functions in php and it has worked but when i try to call checkSecondValue, nothing happens. I have included my variations on calling the function.
Edit: If i try to call it at the bottom without activating the onChange event in the select, it won`t work.
<!--<html>
<head>
<script type="text/javascript" src="validation.js"></script>
</head>
</html>
<script src="validation.js" type="text/javascript"></script>
-->
<?php
//retrieve all the bris for the drop down
include '../../inc/database.php';
$res = BbqcDatabase::getInstance()->doQuery('SELECT * FROM T_TOURNOI_BRIS');
$str = "<select name='ddlBrisSelected' id='ddlBrisSelected' onChange='checkSecondValue()'>";
$bris = ($_GET['bris']);
if($bris == 4)
{
$bris2 = "autre";
}
if($bris == null)
{
$str .= "<option value='' selected></option>";
}
else
{
$str .= "<option value=''></option>";
}
$i = 0;
while($data = mysql_fetch_assoc($res))
{
if($data['F_BRISID'] == $bris)
{
$str .= "<option value='" . $data['F_BRISID'] . "' selected '>" . $data['F_BRISTITLE'] . "</option>";
}
else
{
$str .= "<option value='" . $data['F_BRISID'] . "'>" . $data['F_BRISTITLE'] . "</option>";
}
}
if($bris2 == "autre")
{
$str .= "<option value='autre' selected>Autre</option>";
}
else
{
$str .= "<option value='autre'>Autre</option>";
}
$str .= "</select>";
echo $str;
if(is_numeric($bris))
{
/* echo "<SCRIPT language=\"JavaScript\" SRC=\"validation.js\">checkSecondValue();</SCRIPT>"; */
/* echo "<script> checkSecondValue();</script>"; */
/* echo "<script type=\"text/javascript\">checkSecondValue();</script>"; */
/* echo '<script type="text/javascript">', 'checkSecondValue();', '</script>'; */
/* echo "<SCRIPT LANGUAGE='javascript'>checkSecondValue();</SCRIPT>"; */
}
?>
You can't call client-side javascript functions from PHP, but you can echo code that makes the client call the function on a specific (client-side) event.
Just look at the generated HTML you get from your PHP, and from there, try to see why checkSecondValue() isn't executed on an onChange event.
At the very least, you want your function call to happen only after the page is loaded. This can be done by embedding the function in the body tag during onload:
<body onload="checkSecondValue();">
The function call is going to execute on the client-side, after the entire page has been processed by PHP. You can't communicate back-and-forth between JavaScript and PHP during the process of the page.

Categories