18008 sujets

Questions générales et questions de débutants

[JS] Problème avec l'héritage avec jQuery

Bonjour,

Je suis en train de faire l'intégration de 2 projet pour en faire un.

Voici les projets:

http://jhtmlarea.codeplex.com/ (WYSWYG utilisatn jQuery)
et
http://www.dragmath.bham.ac.uk/

Mon problème:

Quand je crée un nouveau bouton ( à ma sauce ), je suis capable d'ouvrir mon "pop-in" et de le fermer, mais alors quand je veux insérer en utilisant un méthode de jHtmlArea, je ne suis pas capable.

Le principle est simple, mais je ne suis pas capable d'avoir accès l'object de ma classe primaire qui jHtmlArea. Dans mon code je ne suis pas capable d'invoquer dans mon événement la méthode. Désolé, mon code est un peu tout croche.

	    $("#inserer").click(function() {
			//var mathExpression = $("$dragmath").getMathExpression();
		var mathExpression = document.dragmath.getMathExpression();
		$("#mathBox").remove();
		$("txtText").focus();
                result = escape(mathExpression);
		image(escape('http://www.mathtran.org/cgi-bin/mathtran?D=1;tex=') + mathExpression); // ligne qui fonctionne pas.
		//jHtmlArea.fn.image("http://www.mathtran.org/cgi-bin/mathtran?D=1;tex=" + mathExpression); // un autre façon d'avoir accès à image, mais ça fonctionne pas
	    });


Voici ma page HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>UI Éditeur</title>
    <script type="text/javascript" src="scripts/jquery-1.3.2.js"></script>
    <script type="text/javascript" src="scripts/jHtmlArea-0.7.0.js"></script>
    <!--<script type="text/javascript" src="scripts/mathBox.js"></script>-->
    <link rel="stylesheet" type="text/css" href="style/jHtmlArea.css" />
    <link rel="stylesheet" type="text/css" href="style/mathBox.css" />
    <script type="text/javascript">
         $(function() {
            $("textarea").htmlarea({
                toolbar: ["html", "link", "unlink", "|", "image",
                // This is how to add a completely custom Toolbar Button
                {
                // The CSS Class to assign the Button <a> tag
                css: "mathedit",

                // The Text to display in the buttons alt text / tooltip
                text: "Éditeur de formule mathématique",

                // The function to execute when the button is clicked
                action: function(btn) {
                    // 'this' = jHtmlArea object
                    // 'btn' = jQuery object that represents the <A> "anchor" tag for the Toolbar Button
		    
		    this.showMathDialog();

                },
		insererURL : function(url){
		    alert(url);
		    this.image(url);
		}
            }
            ]
        }); // Initialize jHtmlArea's with all default values
        //window.setTimeout(function() { $("form").submit(); }, 3000);
    });
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
    <textarea runat="server" id="txtText" cols="50" rows="15"></textarea>
    </div>
    </form>
</body>
</html>


et le code de this.showMathDialog() qui est dans le fichier jHtmlArea-0.70.js :

//...
updateHtmlArea: function() {
            this.editor.body.innerHTML = this.textarea.val();
        },
        
        showMathDialog : function() {
             // ouvre ma boite de dialogue d'expression mathématique
	    var result;
            $("body").append('<div id="mathBox"><div id="mathBox_aplat"></div><div id="mathBox_loader"></div><div id="mathBox_conteneur"><div id="mathBox_relative"><div id="mathBox_close"></div><div id="mathBox_contenu"><applet id="dragmath" name="dragmath" codebase="applet" code="Display.MainApplet.class" archive="DragMath.jar" width="540" height="300"><param name="language" value="fr"/><param name="outputFormat" value="Latex"/><param name="showOutputToolBar" value="false"/>Pour utilser cette fonctionnalité, vous devez avoir un navigateur qui supporte JavaPour télécharger la dernière version du plug-in.<a href="http://www.java.com">Java.com</a></applet ><form name="form" action=""><div><button id="inserer" type="button">Insérer</button><button id="annuler" type="button" onclick="return cancel();">Annuler</button></div></form></div></div></div></div>');
		    
	    $("#annuler").click(function () {
                $("#mathBox").remove();
            });
	    $("#inserer").click(function() {
			//var mathExpression = $("$dragmath").getMathExpression();
		var mathExpression = document.dragmath.getMathExpression();
		$("#mathBox").remove();
		$("txtText").focus();
                result = escape(mathExpression);
		image(escape('http://www.mathtran.org/cgi-bin/mathtran?D=1;tex=') + mathExpression);
		//jHtmlArea.fn.image("http://www.mathtran.org/cgi-bin/mathtran?D=1;tex=" + mathExpression);
	    });
            return result;
        }


et le code source du projet (HTML, CSS et tralala Smiley langue )
http://rapidshare.com/files/316374674/ComposanteHTML.rar.html

Un gros merci à celui qui m'aidera.
Modifié par Arphus (04 Dec 2009 - 22:36)
Sujet clos
Aller à