Knowledgebase Home Page  >  RapidSpell Web ASP.NET  >  Appearance Customization
Search the Knowledge Base
How to use RapidSpell dialog in a JQuery (or DIV based) modal dialog (JS)?
https://keyoti.com/kb/Default.aspx?ToDo=view&questId=269&catId=57

Options

Print this page
Email this to a friend

 

In this example, a DIV based modaldialog is used instead of the default popup window. 

 

Note that you will need to correct thepath to RapidSpell-DIALOG.js to your own.  Also it uses CDNbased JQuery, you may wish to change this, the exact version does not matter.

 

 

<!DOCTYPE html>

 

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css" />

    <script src="//code.jquery.com/jquery-1.10.2.js"></script>

    <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>

 

    <script src="/Scripts/RapidSpell-DIALOG.js" type="text/javascript"></script>

    <script type="text/javascript">

       rapidSpell.dialog_popupURL = "DIV-MODAL-Popup.aspx";

       rapidSpell.setParameterValue("default", "FinishClosesWindow", false);

 

       rapidSpell.addEventListener('dialog_finishedcheckingall', function (src, textbox, complete) {

           spellcheckperformed = complete;

           $("#dialog").dialog("close");

           rswm_PopUpWin = null;

       });

 

       functionrsw_create_popup_window(url, name, options) {

         

$("#dialog").dialog({               

                width:"420px",

               maxWidth: "450px",

               close: function (event, ui) {

                   $("#dialog").dialog("close");

                   rswm_PopUpWin.window.onunload = null;

                   rswm_PopUpWin = null;

               }

 

           });           

            return if2;

       }

    </script>

    <title></title>

</head>

<body>

<form>

 

<!--Add thisDIV, it will hold the spell checker -->

<div id='dialog' title="Spell check" style="display:none;">

             <iframe id="if2" name="if2" width="370" height="400" style="border: none;"></iframe>

</div>

 

 

 

    <textarea id="Textarea1">Blah fdg retr</textarea>

    <textarea id="Textarea2">Wdas</textarea>

 

    <input type="button" onclick="rapidSpell.dialog_spellCheck(true)" />

</form>

</body>

</html>

 

 

 

 

this example uses a custom popup, calledDIV-MODAL-Popup.aspx (which in this example needs to be in the same folderas the above file):

 

 

<%@ Page ClientTarget="uplevel" language="c#" validateRequest="false"  %>

 

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

      <head>

             <title>Spell Checking</title>

             <style type="text/css">

                 body{overflow:hidden;}

                 div{height:100%;}

             </style>

             <script>

                    opener = parent;

     

             </script>

 

             <script language="C#" runat="server">

           void Page_Load(object sender, EventArgs e)

           {

               //For technicalreasons relating to having to declare the exact assembly name, this version ofpopup.aspx uses code to add the

               //RapidSpellWebcontrol to the page - in a custom version of this, you could just use theRapidSpellWeb control tags.

               //Feel free toset properties in rapidSpellWeb1 as needed.

               Keyoti.RapidSpell.RapidSpellWeb rapidSpellWeb1 = new Keyoti.RapidSpell.RapidSpellWeb();

               rapidSpellWeb1.SSLFriendly = true;

               rapidSpellWeb1.Width = new Unit(100, UnitType.Percentage);

 

               Form1.Controls.Add(rapidSpellWeb1);

           }   

             </script>

       

 

             </head>

      <body>

             <div>

                    <form method="post" runat="server" id="Form1">

                    </form>

             </div>

      </body>

</html>

 


Related Questions:

Attachments:

No attachments were found.