DEscription :
I have a php script that displays the div on an html page
echo '<div class = "star_box" id = "'.$each_status['post_id'].'" onmousedown = "star_it(this.id)"></div>';
Now when I click on this div the star_it function gets called and it works perfect...
The problem
I want to pass another argument in the star it function .. like this
echo '<div class = "star_box" id = "'.$each_status['post_id'].'" onmousedown = "star_it(this.id,'.$each_status['regno'].')"></div>';
or a simple alphabet if any like star_it(this.id,s)
but when I do so the function stops working as when I click the div the function does not gets called ....
I dont know why I am stuck and now my star rating system does not work... I have absolutely no idea what is wrong
Anyone ??
You should modify your string quote's like this :
<?php
$status = "second test";
echo '<div class="star_box" id="'.$id.'" onmousedown="star_it(this.id,'."'".$status."'".');" >Hello</div>';
?>
<script>
function star_it(foo1,foo2){
console.log(foo1);
console.log(foo2);
}
</script>
This example works for me.
So with your code :
<?php
echo '<div class="star_box" id="'.$id.'" onmousedown="star_it(this.id,'."'".$each_status['regno']."'".');" >Hello</div>';
?>
Here you go
echo '<div class = "star_box" id = "'.$each_status['post_id'].'" onmousedown = "star_it(this.id,\''.$each_status['regno'].'\')"></div>';
you forget to add \' before and after your string , the JS engine on the browser will treat your string as an undefined variable and the function will not work because of that .
//my English is not so good.
Try
echo '<div class = "star_box" id = "'.$each_status['post_id'].'" onmousedown = "star_it(this.id,\"'.$each_status['regno'].'\")"></div>';
Related
Im trying to get a link where I have to add a countrycode to a link.
Im trying this:
var link = "http://restcountries.eu/rest/v1/alpha?codes=" + myData;
Where myData is defined by:
var div = document.getElementById("dom-target");
var myData = div.textContent;
dom-target:
<div id="dom-target" style="display: none;">
<?php
$output = $_GET['id'];
echo htmlspecialchars($output);
?>
</div>
Where the $_GET['id'] is a code like FR or NL.
but for some reason when I console.log() it, it comes out with the link and underneath that I see the countrycode, indicating that it hasnt added the countrycode to the link.
Am I doing something wrong here?
var link = "http://restcountries.eu/rest/v1/alpha?codes=" + myData.trim();
the .trim() will remove and spaces
if that doesn't work you can try myData.replace(/(\r\n|\n|\r)/gm,""); this will remove line breaks.
good luck
Im getting data from sql and using php to generate javascript for an edit button for each entry. The edit interface uses a text input in a form. When the generated edit button is clicked, the text within this field is set to equal the name of the entry from sql.
This works fine in all cases expect when the name contains double quotes ("), in which case the quotes are replaced with " in the text field.
The php genertaed javascript is below:
function editButton($suffix,$name)
{
echo "<button class=\"edit\" onclick=\"editMode$suffix()\">Edit</button>";
echo "<script>
<!--
function editMode$suffix(){
document.getElementById(\"title\").innerHTML = \"Edit Artist\"
var main = document.getElementById(\"main\");
main.style.display = 'none';
var edit = document.getElementById(\"edit\");
edit.style.display = 'block';
//Set the input of the edit interface to be equal to the current name
document.getElementById(\"editInput\").value = \"$name\";
document.getElementById(\"artEdit\").value = \"$name\";
}
-->
</script>";
}
The $name variable is sanitized via htmlentities() before being passed to the function. Without doing so, the edit interface for entries with quotes will not even display.
I found this which sounds like the same issue but no solutions (https://code.google.com/archive/p/embeddedjavascript/issues/19) :/
IF anyone has a solution or can point out some stupid thing im doing thats causing this it would be very appreciated. At this point im going to have to just disable database entry for double quotes and limit to singles.
Just change all the double-quotes in the JavaScript portion to single-quotes, then use addslashes() on the $name variable:
function editButton($suffix, $name)
{
$name = addslashes( html_entity_decode($name) );
echo "<button class='edit' onclick='editMode$suffix()'>Edit</button>";
echo "<script>
<!--
function editMode$suffix() {
document.getElementById('title').innerHTML = 'Edit Artist'
var main = document.getElementById('main');
main.style.display = 'none';
var edit = document.getElementById('edit');
edit.style.display = 'block';
//Set the input of the edit interface to be equal to the current name
document.getElementById('editInput').value = '$name';
document.getElementById('artEdit').value = '$name';
}
-->
</script>";
}
*Also added html_entity_decode() to converts the entities back to their initial state. Consider removing the htmlentities() altogether, in which case, you can remove the html_entity_decode() from the above script.
I am self taught PHP with little js experience so it is probably something really simple, but I have made a js function to change the inner html of a table cell and added an onchange event listener on a select element to call the function. However nothing happens when I change the selected value and I have no idea why, considering it is so simple it should. Please help.
td that I want to change:
echo '<tr><td id="pastEvents">';
for($i=0;$i<=3;$i++){
echo '<table class="invisible"><tr><td><img src="/'.$pastEvents[$i]['banner'].'" alt="Event Banner"></td></tr><tr><td>'.$pastEvents[$i]['name'].'</td></tr></table>';
}
echo '</td></tr>';
Event Listener:
echo '<tr><td><table class="invisible"><tr><td>Number Shown: <select name="select" onchange="changePast()"><option value="3">3</option><option value="10">10</option><option value="20">20</option><option value="all">All</option></select></td></tr></table></td></tr>';
Script:
<script>
function changePast(){
var shown = document.getElementsByName("select");
document.getElementById("pastEvents").innerhtml = "test";
}
</script>
actually it is innerHTML
<div id="A"></div>
document.getElementById("A").innerHTML = 'text'
The correct way to use is .innerHtml() instead of .innerhtml()
<script>
function changePast(){
var shown = document.getElementsByName("select");
document.getElementById("pastEvents").innerHtml = "test";
}
</script>
I've got a loop posting images from database.
I tried to give each photo div separate id.
When i tried to send it to script by onclick function
It shows that "$photoid is not defined "
I tried to print this variable in this first php script but it shows me all IDs, so shouldnt be empty or undefined...
$allphotos = mysql_query("SELECT * FROM photos ORDER BY id DESC");
while ($numphotos = mysql_fetch_assoc($allphotos)){
$photoinfo = mysql_query('SELECT * FROM photos WHERE link="'.$numphotos['link'].'" ');
$fetchinfo = mysql_fetch_assoc($photoinfo);
$photoid = $fetchinfo['id'];
echo '<div class="thisphotobox" id="'.$photoid.'"><img src="'.$numphotos['link'].'" alt="photo" class="photolink" onclick=clicked($photoid)></div>';
}
Here goes script:
<script>
function clicked(photoid){
document.getElementById('photoid').style.backgroundColor = 'red'
}
</script>
Change this:
echo '<div class="thisphotobox" id="'.$photoid.'"><img src="'.$numphotos['link'].'" alt="photo" class="photolink" onclick=clicked($photoid)></div>';
to this:
echo '<div class="thisphotobox" id="'.$photoid.'"><img src="'.$numphotos['link'].'" alt="photo" class="photolink" onclick="clicked('.$photoid.');"></div>';
otherwise, the output is just clicked($photoid), all text.
Also change that:
function clicked(photoid){
document.getElementById('photoid').style.backgroundColor = 'red'
}
to that:
function clicked(photoid){
document.getElementById( photoid.toString() ).style.backgroundColor = 'red';
}
The answer above is working, but they forgot to add something,
instead of
echo '<div class="thisphotobox" id="'.$photoid.'"><img src="'.$numphotos['link'].'" alt="photo" class="photolink" onclick="clicked('.$photoid.');"></div>';
copy this code
echo '<div class="thisphotobox" id="'.$photoid.'"><img src="'.$numphotos['link'].'" alt="photo" class="photolink" style="background-color:white" onclick="clicked('.$photoid.');"></div>';
add the style="background-color:white;" i think you can't access the .style in js if you didn't initialize it in your div. hope this will help
This is simply an escaping issue. The argument $photoid in your echoed function has to be escaped if it is a string. In your code above this:
onclick=clicked($photoid)
should be
onclick="clicked($photoid)"
if $photoid is a number or
onclick="clicked(\'$photoid\')"
if it is alphanumeric or a string
I have a input field that gets it value from a db lets say the value is M,K,H,J,V or G depending on the value it needs to open the div with aaa,bbb,ccc,ddd,eee or fff as text.
The code that is displayed on the page is as followed i left out the retrieval part from the db that part is working (the input box shows M,K,H,J,V or G depending on the id.)
echo "<input type='text' name='periode' id='periode' data-related-item='" .$row['periode']. "' value='" .$row['periode']. "'>";
echo "<div class='hidden'><div id='M'>aaa</div></div>";
echo "<div class='hidden'><div id='K'>bbb</div></div>";
echo "<div class='hidden'><div id='H'>ccc</div></div>";
echo "<div class='hidden'><div id='J'>ddd</div></div>";
echo "<div class='hidden'><div id='V'>eee</div></div>";
echo "<div class='hidden'><div id='G'>fff</div></div>";
When i check the source code in developer mode it shows that the data-related-item part is correctly retrieved from the db:
<input type="text" name="periode" id="periode" data-related-item="M" value="M">
I want to use the following JS but i need to change it to work with textboxes.
<script type="text/javascript">
function evaluate1(){
var item = $(this);
var relatedItem = $("#" + item.attr("data-related-item")).parent();
if(item.is(":checked")){
relatedItem.fadeIn();
}else{
relatedItem.fadeOut();
}
}
$('input[type="checkbox"]').click(evaluate1).each(evaluate1);
</script>
The simplest approach is offcourse changing:
$('input[type="checkbox"]').click(evaluate1).each(evaluate1);
into
$('input[type="textbox"]').click(evaluate1).each(evaluate1);
But what do i need to do with:
if(item.is(":checked")){
Thanks for any help in advance.
I tried the following but it aint working.
if(item.is("M||K||H||J||V||G")){
SOLUTION BY ROBERT ROZAS
The solution is in jsfiddle
http://jsfiddle.net/dXTtz/7/
I made this code based on the code you provide:
$(document).ready(function(){
$("#periode").keyup(function(){
var valor = $("#periode").val();
$(".hidden").each(function(){
var hijo = $(this).children().attr('id');
if(hijo == valor)
{
$(this).removeClass("hidden");
}
});
});
});
Working fiddle here: http://jsfiddle.net/robertrozas/dXTtz/2/
This way is working on page load: http://jsfiddle.net/robertrozas/dXTtz/4/
Page load and removing the extra hidden divs: http://jsfiddle.net/dXTtz/5/