I am reading Beginning CakePHP, and to make it so that you can vote on comments, it tells you to create a couple of AJAX links:
<?=$ajax->link('<li>up</li>',
'/comments/vote/up/'.$comment['Comment']['id'],
array('update' => 'vote_'.$comment['Comment']['id']),
null, false);?>
<?=$ajax->link('<li>down</li>',
'/comments/vote/down/'.$comment['Comment']['id'],
array('update' => 'vote_'.$comment['Comment']['id']),
null, false);?>
This works fine in IE, but in FF it doesn't do anything at all. It doesn't even reach the controller or model, because the links it generates don't do anything.
The HTML it generates looks like this:
<a id="link2128392960" onclick=" event.returnValue = false; return false;" href="/blog/comments/vote/up/1"/>
<li>
<a id="link2128392960" onclick=" event.returnValue = false; return false;" href="/blog/comments/vote/up/1">up</a>
</li>
<script type="text/javascript">
//<![CDATA[
Event.observe('link2128392960', 'click', function(event) { new Ajax.Updater('vote-1','/blog/comments/vote/up/1', {asynchronous:true, evalScripts:true, requestHeaders:['X-Update', 'vote-1']}) }, false);
//]]>
</script>
Firstly, the HTML output you pasted isn't accurate. It looks like you copied this from Firebug or something instead of your browsers actual 'View Source' page. CakePHP doesn't actually generate self-closing anchor tags in this scenario (<a /> as opposed to <a></a>) like your example shows.
I believe this points out your problem though. The fact that your browser's HTML parser (or Firebug's) tried to correct the code at runtime points to your HTML being malformed. Specifically, you cannot put a block-level element (<li>) inside an inline element (<a>).
<div class="actions">
<ul>
<li>
<?php echo $ajax->link('up', array(
'controller' => 'comments',
'action' => 'vote',
'up',
$comment['Comment']['id']
), array(
'update' => 'vote_' . $comment['Comment']['id']
), null, false); ?>
</li>
<li>
<?php echo $ajax->link('down', array(
'controller' => 'comments',
'action' => 'vote',
'down',
$comment['Comment']['id']
), array(
'update' => 'vote_' . $comment['Comment']['id']
), null, false); ?>
</li>
</ul>
</div>
The above example will produce valid HTML as the inline <a> elements will then be wholly nested within block-level <li> elements. This should hopefully fix the functionality of your page in standards-compliant browsers.
I don't think it's valid HTML to have an anchor tag without an ending anchor tag, like in your first link:
<a id="link2128392960" onclick=" event.returnValue = false; return false;" href="/blog/comments/vote/up/1"/>
Maybe Firefox is mad at you for that.
You also have two tags with the same id, which is also invalid HTML, but might also mean that your Javascript is searching for clicks on the second link but that link is being "eaten" by the first link because you never ended it.
Just throwing out ideas ;p
Using php short tags ("<?") can be considered a bad practice, plus they are being removed in php 6.
Related
I need to add target="_blank" to links I'm retrieving using this PHP code on a WordPress+WooCommerce installation:
$products = wc_get_products([
'status' => 'publish',
'limit' => -1,
'product_cat' => 'talleres'
]);
$locaciones = array_map(function ($product) {
return [
// more code goes here, I just deleted it for this question
'popup_html' => $product->get_categories() // this is where I need the target="_blank"
];
}, $products);
I tried with jQuery:
$(document).ready( function(){
$('a').attr('target', '_blank');
});
But it is not working, it doesn't add the target="_blank" to the link.
I'm thinking maybe this can be added directly to the PHP code?
You can use a php regex filter like preg_replace and search by "href" and replace the match putting the target="_blank" before the href resulting in "target='_blank' href"
You may use this script. you need to add class or parent div of Anchor tag otherwise it will add to all anchors.
jQuery(document).ready( function($){
$('a').each(function(){
$(this).attr('target', '_blank');
});
});
Since I needed to open all and every link on a new tab, I just used <base target="_blank"> for the entire page.
This is the original php code:
function lovethemes_pricing_shortcode($atts)
{extract(shortcode_atts(array(
"heading" => '',
"price" => '',
"link" => '',
"name" => '',
), $atts ) );
return '<div class="pricing animated bounceIn">
<section class="head">'.heading.'
<section class="content">
<ul><li class="price">'.$price.'</li>
<li>'.$name.'</li>
</ul></section> </div>';}
add_shortcode('pricing', 'lovethemes_pricing_shortcode');
This is what is written on my page in the backend:
[pricing heading="7 februari 2015"
price="Strak bekleden van een taart"
link="/agenda/workshops/strak-bekleden-van-een-fondant-taart"
name="Info"]
Resulting in this:
http://www.alexandra-van-zandbergen.be/wp-content/uploads/2015/08/Schermafbeelding-2015-08-08-om-13.23.38.png
And what I would like to have is this:
http://www.alexandra-van-zandbergen.be/wp-content/uploads/2015/08/Schermafbeelding-2015-08-08-om-13.22.47.png
I can read and write html and css but no php... Can anyone help me with this please? I've tried to add several codes and nothing is working.
I have to be able to change the image in the backend, I would like to be able to just choose an image from the Wordpress image gallery.
Thanks in advance!
Alexandra
I'm not very familiar with it either, and would need to try it to see if it works, so pls don't shoot me if it does not. However, this function makes use of the shortcode API.
The code tells to create a [pricing] shortcode, currently with 4 attributes. So, if all the rest works, then you most likely can simply add another one.
What I do not understand - and I'm not taking the time to look it up - is why all variables in your code start with $, but not the heading. I'll ignore that since it doesn't seem to be the problem.
Note:
It's best to add:
the image size to the HTML for performance. I'm assuming that you'll
use images of the same size. If you would want to set the image
size, you can create attributes for it too.
an alt text for SEO. Below I use the price attribute.
While I'm at it I would suggest to add a link to the image and title too. People sometimes click on it instead of on the info button. This would make it more user friendly.
So, it then would look like this:
function lovethemes_pricing_shortcode($atts) {
extract(shortcode_atts(array(
"heading" => '',
"price" => '',
"link" => '',
"name" => '',
"img" => '',
), $atts ) );
return '<div class="pricing animated bounceIn">
<section class="head">'.heading.'
<section class="content">
<ul><li class="price">'.$price.'</li>
<li><img src="'.$img.'" alt="'.$price.'" width="247" height="186" /></li>
<li>'.$name.'</li>
</ul></section></div>';
}
add_shortcode('pricing', 'lovethemes_pricing_shortcode');
and your shortcode would be:
[pricing heading="7 februari 2015"
price="Strak bekleden van een taart"
link="/agenda/workshops/strak-bekleden-van-een-fondant-taart"
img="/your/image/url.jpg"
name="Info"]
To make it a little more user friendly, you could also rename the attributes to something that corresponds to the content, f.ex. heading > date
I hope this helps!
I'm using Zend_Form. I'd like to make a forgot password form that is all on one line like this:
label: [ field ] [ submit button ]
And I'd like it to be all within a single paragraph tag. I'd like the paragraph tag to be inside the form tag. So, basically, I'd like to replace Zend_Form's default DL tag with a P tag. I can do it, sort of, but not exactly.
If I use the default, like so:
class Application_Form_Forgot {
public function init() {
// my fields, no special decorators...
}
}
That produces this HTML:
<form {the attributes} ><dl class="zend_form"> {the fields} </dl></form>
I'd like this HTML instead:
<form {the attributes} ><p> {the fields} </p></form>
Here's what I've tried:
class Application_Form_Forgot {
public function init() {
// my fields...
$this->setDecorators(
array(
'FormElements',
'Form',
array('HtmlTag', array('tag' => 'p')),
)
);
}
}
But that produces this HTML:
<p><form {the attributes} > {the fields} </form></p>
The paragraph tags surround the form. Not exactly what I'd like.
I've also tried:
Googling and reading a bunch of posts on StackOverflow and elsewhere about how to remove the DL tags. Forgive me if I missed the answer somewhere and this is a duplicate.
Reading the Zend source to figure out a way to do it. I found the DlDt Decorator, but that seems to only apply to the elements, not the form.
Coming to grips with having the paragraph tag outside the form and moving on with my life.
Can someone please point me in the right direction - if this is even possible?
Thanks,
Phillip
You were close, change what you had to:
$this->setDecorators(
array(
'FormElements',
array('HtmlTag', array('tag' => 'p'))
'Form',
)
);
If you imagine decorators working by each one rendering 'around' what was there before, with this order it renders the form elements, then around that it puts the paragraph, and then around that it puts the form tag.
I am trying to add non HTML attribute in htmlOptions array of Yii's CHTML::image($url, $alt, $htmlOptions), but in rendered page these attributes does not get added.
Basically i want to use lazy loading of images which needs to store original image url in 'data-origional' and a placeholder in SRC tag. attribute. For some reasons i can't use a direct HTML <img /> tag in my code.
Thanks for any suggestions guys.
This code works fine:
echo CHtml::image('http://google.com/images/srpr/logo3w.png', '', array(
'data-original' => 'original',
'another-attribute' => 'bla-bla-bla',
));
It returns:
<img
alt="" src="http://google.com/images/srpr/logo3w.png"
another-attribute="bla-bla-bla"
data-original="original"
>
I have a form that works perfectly. Now, when i add the following code, it throws the jQuery("body").undelegate is not a function error.
<?php
echo CHtml::dropDownList(
'country_id',
'',
array('0'=>'Choice One',
'1'=>'USA',
'2'=>'France',
'3'=>'Japan',),
array(
'ajax'=>array(
'type'=>'POST',
'url'=>Yii::app()->createUrl('users/aTest'),
'success'=>'function(data){alert(data)}',
)));
?>
In UsersController, I have the following action (and it is also included in the accessRules)
public function actionATest()
{
echo "this is a test";
}
When i expand the error, a specific line of code is highlighted (the second one)
jQuery(function($) {
$(".errorDisplay").animate({opacity: 1.0}, 3000).fadeOut("slow");
jQuery('body').undelegate('#country_id','change').delegate('#country_id','change',function(){jQuery.ajax({'type':'POST','url':'/index.php/users/unaPrueba','success':function(data){alert(data)},'cache':false,'data':jQuery(this).parents("form").serialize()});return false;});
Any ideas??? Anybody had this problem? Couldn't find it anywhere!
Check that your jQuery includes aren't conflicting. If you're adding jQuery with your own tag, Yii might still be automatically adding another jQuery file you weren't expecting, as part of its built-in assets (see this question). You can disable Yii's jQuery:
'components'=>array(
'clientScript'=>array(
'scriptMap'=>array(
'jquery.js'=>false,
),
),
)