Intégrer fonction javascript dans php

Résolu/Fermé
florire Messages postés 151 Date d'inscription lundi 15 juillet 2013 Statut Membre Dernière intervention 15 juillet 2022 - Modifié par florire le 20/03/2014 à 07:50
florire Messages postés 151 Date d'inscription lundi 15 juillet 2013 Statut Membre Dernière intervention 15 juillet 2022 - 22 mars 2014 à 12:59
Bonjour,
J'ai une fonction en js qui me permet d'afficher un message du style notification.

(function($){
    
    $.fn.notif = function(options){
        
        var settings = {
            html : '<div class="notification animated fadeInLeft {{cls}}">\
          <div class="left">\
          {{#icon}}\
            <div class="icon">\
              {{{icon}}}\
            </div>\
            {{/icon}}\
            {{#img}}\
            <div class="img" style="background-image:url({{img}});"></div>\
            {{/img}}\
          </div>\
          <div class="right">\
            <h2>{{title}}</h2>\
            <p>{{content}}</p>\
           </div>\
        </div>',
        icon : 'ℹ',
        timeout:false
        }
        if(options.cls == 'error'){
            settings.icon = '❌'
        }
        if(options.cls == 'success'){
            settings.icon = '✓'
        }
        var options = $.extend(settings, options);
    
        return this.each(function(){
            var $this = $(this);
            var $notifs = $('> .notifications', this);
            var $notif = $(Mustache.render(options.html, options));
            if ($notifs.length == 0){
                $notifs = $('<div class="notifications animated flipInX"/>');
                $this.append($notifs);
            }
            $notifs.append($notif);
            if(options.timeout){
                setTimeout(function(){
                    $notif.trigger('click');
                },options.timeout)
            }
            $notif.click(function(event){
                event.preventDefault();
                $notif.addClass('fadeOutLeft').delay(500).slideUp(300, function(){
                    if($notif.siblings().length == 0){
                        $notifs.remove();
                    }
                    $notif.remove();
                });
            })
        })
    }
    $('.add').click(function(event){
        event.preventDefault();
        $('body').notif({title:'Mon titre', content:'Mon contenu', cls:'success', timeout:2000});
    })
})(jQuery);


Sur mon script la notification s'affiche si on clic sur un élément qui a pour class "add".
Mais je voudrais pour voir l'afficher dans mon code php.

Par exemple:
if(){
//On affiche la notification
}


j'ai essayer quelque truc mais sans succès.. Je suis pas très fort...

Merci de votre aide :D

2 réponses

mpmp93 Messages postés 6651 Date d'inscription mercredi 13 avril 2011 Statut Membre Dernière intervention 28 septembre 2015 1 325
Modifié par mpmp93 le 20/03/2014 à 10:33
Bonjour,

Aïe, aille hailleuuu....

Vous mélangez du HTML dans du Javascript qui contient des marqueurs de template, non?

Exemple:
<div class="img" style="background-image:url({{img}});"></div>


Or, si vous utilisez un template, sauf erreur de ma part, ledit template est traité en amont par PHP. Je ne vois pas JS remplir votre template ou alors vous avez d'autres scripts JS pour "remplir les trous"....

Pour remplir les trous depuis PHP:

<div class="img" style="background-image:url(<?php echo $image; ?>);"></div>


A+

public function meilleurProgrammeurDuMonde() { return "MOI"; } // humour
0
florire Messages postés 151 Date d'inscription lundi 15 juillet 2013 Statut Membre Dernière intervention 15 juillet 2022 7
Modifié par florire le 20/03/2014 à 11:03
Ma "fonction" est "jquery.notif.js".
Pour remplir le template Mustache.js est utiliser.

Dans <head> de la page php:
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>


Et après </body>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script type="text/javascript" src="mustache.js"></script>
    <script type="text/javascript" src="jquery.notif.js"></script>


Si je met
<a href="#" class="add">Notif !</a>
dans ma page php.
Au clic sur "Notif !" la notification s'affiche gràce à
$('.add').click(function(event){
        event.preventDefault();
        $('body').notif({title:'Mon titre', content:'Mon contenu', cls:'success', timeout:2000});
    })

dans mon js

Si je met directement
$('body').notif({title:'Mon titre', content:'Mon contenu', cls:'success', timeout:2000});
    })

dans mon js, la notification s'ouvre directement à l'ouverture de la page php.
0
florire Messages postés 151 Date d'inscription lundi 15 juillet 2013 Statut Membre Dernière intervention 15 juillet 2022 7
22 mars 2014 à 12:59
up
0