Quoting issue while echoing a html part from php to jquery - php

In my php file I am echoing back an html response to my jQuery function.
Due some wrong quoting that I am applying data is no being passed through onclick event
echo " <div class='img-x' id='img-x-".$newdata['id']."' ><span onclick='test('".$newdata['id']."','".$newdata['image_path']."');' class='icon-remove'></span></div> <img src='http://localhost/corridor/uploads/".$actual_image_name."' class='img_prvw' id='img-x-".$newdata['id']."' />";
in html it shows like this
<span onclick="test(" 164','13906347455190.jpg');' class="icon-remove"></span>
Where am I doing it wrong?

Try escaping the quotes properly.
echo "<div class='img-x' id='img-x-".$newdata['id']."'><span onclick=\"test('".$newdata['id']."','".$newdata['image_path']."');\" class='icon-remove'></span></div> <img src='http://localhost/corridor/uploads/".$actual_image_name."' class='img_prvw' id='img-x-".$newdata['id']."' />";
^

I am assuming you are ajaxing this in:
echo <<< _html
<div class="img-x" id="img-x-$newdata['id']">
<span data-id="$newdata['id']" data-imagepath="$newdata['image_path']"
class="icon-remove"></span>
</div>
<img src="http://localhost/corridor/uploads/$actual_image_name"
class="img_prvw" id="img-x-$newdata['id']" />
_html;
and in the succes:
success: function() {
$("#someContainer").html(data);
$("#someContainer .icon-remove").on("click",function() {
test($(this).data("id"),$(this).data("imagepath"));
});
}
If no ajax then
echo <<< _html
<div class="img-x" id="img-x-$newdata['id']">
<span onclick="test('$newdata['id']','$newdata['image_path'].')"
class="icon-remove"></span>
</div>
<img src="http://localhost/corridor/uploads/$actual_image_name"
class="img_prvw" id="img-x-$newdata['id']" />
_html;

Related

Replacing anchor tag text after it is clicked without removing css

I am changing anchor tag text once it is clicked using jquery (replaceWith) and it is working fine. But it also replaces the css of the anchor tag text.
Can anyone help me how not to replace css or add it again.
My html is as follows:
<div class="col-xs-12 col-md-12" >
<a class="btn btn-lg btn-success deal" target="_blank" style="width:100%;background:#b71c1c;" rel="nofollow, noindex"
href="<?= $coin["link"]; ?>" >
<b>Get Offer</b>
</a>
</div>
and code:
$(document).ready(function(){
$('.deal').click(function(){
$(this).replaceWith("<?php echo $coin['coupon_code']; ?>");
});
});
If <?php echo $coin['coupon_code']; ?> contains html tags use
$(this).find('b').html('<?php echo $coin['coupon_code']; ?>');
Or if it is plain text use
$(this).find('b').text('<?php echo $coin['coupon_code']; ?>');
If you don't want bold remove .find('b')
If you just want to replace the content of the inner <b> tag, this is your best option:
$('.deal').click(function(){
$(this).find('b').text('<?php echo $coin['coupon_code']; ?>');
});
Try this, you just need to change text.
$(this).html("<?php echo '<b>'.$coin['coupon_code'].'</b>'; ?>");

Simple html dom doesn't work properly

I have a problem with simple html dom on php 5.5.8. I have code like that:
//Getting page content
$t=$this->curl->getResponse();
//Show page content
echo $t;
//Parse with simple html dom and show result
$dm=str_get_html($t);
echo $dm->save();
After I run the code, I see that
echo $t;
returns something like that:
<output omitted>
<span style="display:block;">ORGANIZATION CODE:123456789ABCD</span></div>
</div><br><div id="pageTitle">
<h1>Select your flights</h1>
</div>
<div id="yellowheader"></div>
<div id="navDiv">
<ol id="tripmeter">
<ul><span class="tripmeterNotSelected">Search Flight</span></ul>
<ul id="tripmeterLink"><span id="tripmeterSelected">Select Flight</span><div id="tripmeterTail"></div>
</ul>
<ul><span class="tripmeterNotSelected">Guest Details</span></ul>
<ul><span class="tripmeterNotSelected">Add-Ons</span></ul>
<ul><span class="tripmeterNotSelected">Payment</span></ul>
<ul><span class="tripmeterNotSelected">Itinerary Receipt</span></ul>
</ol>
</div>
</div>
<div id="selectMainBody" class="main">
<div id="errorDiv"></div><input type="hidden" name="xxxxxxxxxxx" id="xxxxxxxx"><div id="tourBasingDialog" style="display:block;"><br><center>
<output omitted>
While
echo $dm->save();
returns
<output omitted>
<span style="display:block;">ORGANIZATION CODE:123456789ABCD</span>
</div> </div><br></div>
<div id="selectMainBody" class="main"> <div id="errorDiv"></div>
<input type="hidden" name="xxxxxxxx" id="xxxxxxx">
<div id="tourBasingDialog" style="display:block;"><br>
EOF
As you can see, after str_get_html() as save() page content changed and cutted. Why it happened?
you're missing something at some point, but Simple HTML Dom Parser working fine.
I copied your html into file, loaded that file using file_get_contents('content.htm'); and printed that stuff.
and hence, after calling the $html->save(); displayed and got the same output.
require_once 'dom.php';
$html = file_get_contents('content.htm');
echo "<h2>Complete File</h2>";
echo $html ;
$html = str_get_html($html);
echo "<hr />";
echo "<h2>After calling save()</h2>";
echo $html->save("dump.html"); //save stuff to dump.html file
and that gave me this output
output of dump.html

html being reformed by ajax / javascript process

I have a simple ajax call inside a javascript function to a php file, which searches the DB and returns formatted html. Alls fine, but for some reason the returned html is being wrongly formatted.
Javascript:
$.ajax(
{
url: "getItems.php?lastID=10",
success: function(html)
{
if(html)
{
$("#main").prepend(html);
}
}
});
getItems.php
<?php
mysql_connect();
$lastID = $_GET['lastID'];
$result = mysql_query("SELECT ...");
while ($row = mysql_fetch_assoc($result))
{
echo '<span class="iteminfo"> ';
echo '<a class="username" href="http://x.com/'.$row['UserName'].'" target="_blank"/>'.$row['UserName'].'</a><br/>';
echo '<a class="status" href="http://x.com/'.$row['UserName'].'/c/'" target="_blank" />'.$created_at.'</a></span>';
}
?>
which should return (and it returns this correctly in Firebug)
<span class="iteminfo">
<a class="username" href="http://x.com/username" target="_blank"/>username</a><br/>
<a class="status" href="http://x.com/username/c/" target="_blank" />the date</a>
</span>
but instead its outputting:
<span class="iteminfo">
<a class="username" href="http://x.com/username" target="_blank"/></a>username<br/>
<a class="status" href="http://x.com/username/c/" target="_blank" /></a>the date
</span>
and I've no idea why.
while ($row = mysql_fetch_assoc($result))
{
echo '<span class="iteminfo"> ';
echo '<a class="username" href="http://x.com/'.$row['UserName'].'" target="_blank">'.$row['UserName'].'</a><br/>';
echo '<a class="status" href="http://x.com/'.$row['UserName'].'/c/'" target="_blank" >'.$created_at.'</a></span>';
}
You have closed a tag wrong manner
<a> content </a>
but u have used
<a/></a>
It's a fairly simple problem -- you're closing your anchor tags and then trying to close them again. The HTML spec I think gives browsers the option of creating an additional tag here.
Here's the code you want to change:
echo '<a class="username" href="http://x.com/'.$row['UserName'].'" target="_blank">'.$row['UserName'].'</a><br/>';
echo '<a class="status" href="http://x.com/'.$row['UserName'].'/c/'" target="_blank" >'.$created_at.'</a></span>';
}
The only difference is that the <a> tags are terminated by '>' and not '/>' which would imply that you're closing it at the same time.

php htmlentities($str) with jQuery?

I'm echoing quotes through htmlentities($str) and it works the first time, but it's for caption's on images that are being swapped via jQuery when clicked- then the caption shows the html entity ".
How can I echo the text with quotes so that it still appears as a " instead of the $quot; after clicked?
Here's my html
<div class="smallImageWrapper">
<?php if(empty($row_rsPTN['img1'])): echo "" ?>
<?php else: ?>
<span class="smallImage"><img src="../images/products/pbetn/50x50/<?php echo $row_rsPTN['img1']; ?>" alt="<?php echo htmlentities($row_rsPTN['img1caption']); ?>" name="smallImage" id="smallImage1" height="50px" width="50px" /></span>
<?php endif; ?>
and here's my jQuery to swap the images:
$("#smallImage1").bind("click", function() {
$("#largeimage").attr("src","../images/products/pbetn/180x280/<?php echo $row_rsPTN['img1']; ?>");
$("#largeimage").attr("alt","<?php echo htmlentities($row_rsPTN['img1caption']); ?>");
$(".caption").text("<?php echo htmlentities($row_rsPTN['img1caption']); ?>");
});
here's a link to my test site where you can see it occurring:
http://www.imsmfg.com/new/test/products/ptn.php?menuproduct=Lacing%20Strips
Let me know if you need more info.
Thanks!
Change this line:
$("#largeimage").attr("alt","<?php echo htmlentities($row_rsPTN['img1caption']); ?>");
To this:
$("#largeimage").attr("alt","<?php echo addslashes($row_rsPTN['img1caption']); ?>");
jQuery entitizes things automatically, so you don't need to put entities in that quote. You just need to escape any quotes. Hence addslashes.

PHP - indent block of html

Let's say I have the following code:
<?php
echo "<div id=\"root\">";
echo "<div id=\"child_of_root\">";
echo "<img src=\"picture1.png\">";
echo "<img src=\"picture2.png\">";
echo "<img src=\"picture3.png\">";
echo "<img src=\"picture4.png\">";
echo "<img src=\"picture5.png\">";
echo "</div>";
echo "</div>";
?>
If I ran this the following HTML would be rendered all inline without any line breaks:
<div id="root"><div id="child_of_root"><img src="picture1.png"><img src="picture2.png"><img src="picture3.png"><img src="picture4.png"><img src="picture5.png"></div></div>
If I ran the following code:
<?php
echo "<div id=\"root\">\n";
echo "\t"."<div id=\"child_of_root\">\n";
echo "\t\t"."<img src=\"picture1.png\">"."\n";
echo "\t\t"."<img src=\"picture2.png\">"."\n";
echo "\t\t"."<img src=\"picture3.png\">"."\n";
echo "\t\t"."<img src=\"picture4.png\">"."\n";
echo "\t\t"."<img src=\"picture5.png\">"."\n";
echo "\t"."</div>"."\n";
echo "</div>";
?>
It wound render the following beautiful HTML:
<div id="root">
<div id="child_of_root">
<img src="picture1.png">
<img src="picture2.png">
<img src="picture3.png">
<img src="picture4.png">
<img src="picture5.png">
</div>
</div>
Is there a way I could achieve these beautiful indents without having to put \t before every line I want to indent. I mean so that I can indent a block instead of one line.
For one thing, it's HTML markup, so it doesn't matter how it's formatted, the browser renders it all the same. Using a tool like Firebug can give you a much better way of navigating HTML in your web-pages.
On another note, you don't have to continually use echo commands to output HTML. PHP is more-or-less a templating language in itself, so you could just exit PHP, output your HTML in your own format, and then re-enter PHP.
For example:
<?php // ... your code before this ... ?>
<div id="root">
<div id="child_of_root">
<img src="picture1.png">
<img src="picture2.png">
<img src="picture3.png">
<img src="picture4.png">
<img src="picture5.png">
</div>
</div>
<?php // ... your code after this ... ?>
If your output needs some level of dynamism to it, you can always use PHP to add in loops and whatnot.
<?php // ... your code before this ... ?>
<div id="root">
<div id="child_of_root">
<?php for ($x = 1; $x <= 5; $x++): ?>
<img src="picture<?php echo $x; ?>.png">
<?php endfor; ?>
</div>
</div>
<?php // ... your code after this ... ?>
If you still need formatted HTML, maybe for displaying code samples or something, you'll either have to continue manually using \n and \t, or you could check out the PHP Tidy extension, which is built for formatting HTML.
First of all use:
echo '<img src="picture1.png">';
instead of
echo "<img src=\"picture1.png\">";
Code is much more clear.
If you want to return HTML code in PHP, there is no other way to do indents.
However why you want to print HTML code in PHP ? Can't you just exit PHP block here ?
<?php
// do something and exit PHP block
?>
<div id="root">
<div id="child_of_root">
<img src="picture1.png">
<img src="picture2.png">
<img src="picture3.png">
<img src="picture4.png">
<img src="picture5.png">
</div>
</div>
<?php
// do again something in PHP
?>
I would suggest using HEREDOC for this. It's best for holding large blocks of HTML and Text that you wish to retain formatting:
//Note that I used spaces and not tabs, but that's only due to the post editor.
echo <<<HTML
<div id="root">
<div id="child_of_root">
<img src="picture1.png">
<img src="picture2.png">
<img src="picture3.png">
<img src="picture4.png">
<img src="picture5.png">
</div>
</div>
HTML;
You can also do
$variable = <<<OPENINGTAG
text
text
text
OPENINGTAG;
echo $variable;
Variables will also be parsed inside HEREDOC strings. Just be careful of the ending tag, it's very temperamental. No spaces before or after on it's line. I don't even know if comments are allowed.
Here it is using Dominic Barnes example with a loop:
<?php
echo <<<HTML
<div id="root">
<div id="child_of_root">
HTML;
for ($x = 1; $x <= 5; $x++)
{
echo <<<HTML
<img src="picture$x.png">
HTML;
}
echo <<<HTML
</div>
</div>
HTML;
?>
could also do:
<?php
$output = <<<HTML
<div id="root">
<div id="child_of_root">
HTML;
for ($x = 1; $x <= 5; $x++)
{
$output .= <<<HTML
<img src="picture$x.png">
HTML;
}
$output .= <<<HTML
</div>
</div>
HTML;
echo $output;
?>
NOWDOC is also available in 5.3+ which act as single quoted strings with no variable parsing.
HEREDOC and NOWDOC strings can be concatenated on to in the same way as normal strings.
If you put your picture ids in an array, you can do a foreach() loop that echoes each of the images with the new line and tab characters in front without having to code it by hand. E.g.
echo '<div id="root">\n';
echo '\t<div id="child_of_root">\n';
$images = array('picture1', 'picture2', 'picture3', 'picture4', 'picture5');
foreach ($images as $image) {
echo '\t\t<img src="'.$image.'.png">\n';
}
echo '\t</div>\n';
echo '</div>';
I tried Tidy, but for some reason no matter how I configure it, it won't seem to indent. However, somebody else has written some code that will:
PHP function for cleaning up HTML and JavaSctipt code
There are also some intelligent guidelines for avoiding the need for such code:
Get beautifully indented HTML with your PHP templates: two rules to follow
Also: fredsco.com/programming/indenting-html-output-in-php
Here is an example that worked for me:
<?php
echo '
<div style="margin-left: 100px">
<div id="root">
<div id="child_of_root">
<img src="picture1.png" /><br />
<img src="picture2.png" /><br />
<img src="picture3.png" /><br />
<img src="picture4.png" /><br />
</div>
</div>
</div>
';
?>

Categories