I'm developping a new application using ZF2. The problem is in my .phtml file. I have a <div> contains a data-action for a js files, but the problem is that when I click nothing happens.
I do not know what the problem is.
Here is my code:
<html>
<head>
<meta charset="UTF-8">
<?php
echo $this->headLink(array('rel' => 'shortcut icon', 'type' => 'image/vnd.microsoft.icon', 'href' => $this->basePath() . '/img/favicon.ico'))
//<!-- Theme CSS -->
->prependStylesheet('/css/font.css')
->prependStylesheet('/css/picedit.css')
->prependStylesheet('/dist/css/picedit.min.css')
->prependStylesheet($this->basePath() . '/frontend/css/picedit.min.css')
?>
</head>
<body>
<form name="testform" action="out.php" method="post" enctype="multipart/form-data">
<div class="picedit_action_btns active">
<div class="picedit_control ico-picedit-picture" data-action="load_image"> </div>
<div class="picedit_control ico-picedit-camera" data-action="camera_open"> </div>
<div class="center">or copy/paste image here</div>
</div>
</form>
<script src="<?php echo $this->basePath(); ?>/dist/js/picedit.js"></script>
<script src="<?php echo $this->basePath(); ?>/dist/js/picedit.min.js"> </script>
<script src="<?php echo $this->basePath(); ?>/dist/js/jquery.min.js"> </script>
<script src="<?php echo $this->basePath(); ?>http://cdnjs.cloudflare.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$('.picedit_box').picEdit({
imageUpdated: function (img) {},
formSubmitted: function () {},
redirectUrl: false,
defaultImage: false
});
});
</script>
</body>
</html>
Any help please ?? Thanks.
It is better to add scripts like this:
<?php
echo $this->headScript()->prependFile($this->basePath() . '/js/some_file.js')
->prependFile($this->basePath() . '/js/another_file.js');
It is very similar to how you added the stylesheets.
You can check official ZF2 documentation on this here.
Please try this and please come back if it still doesn't work after that.