1

I have been trying for 3 hours to get my Alertify JS code to work. I need these functions to go right after each other and to make the answer to the prompt a global variable that I can use in another function. What happens when I run it is it does the first prompt, but i doesn't do any of the other ones. I am still new to coding an I bet I did something dumb. This is what I have.

function appchange() {
alertify.prompt("Enter the number of the app you want to  change. From left to right, 1-5.", ' '
           , function(evt, a) { numb = a;
                              linkURL();
                              });
}
function linkURL() {
alertify.prompt("Enter the link you want the app to go to.", 'https://'
           , function(evt, b) { url = b;
                              iconHTML(); 
                              });
}
function iconHTML() {
alertify.prompt("Enter the html of the icon from fontawesome.com/icons or you can use a capitol letter. CAN NOT BE A PRO ICON!", ' '
           , function(evt, c) { icon = c;
                              finish(); 
                              });
}
function finish() {
}

If anyone can fix what I am doing wrong, that would be awesome. Thanks!

Brian Baldner
  • 51
  • 7
  • Do you also have the code where you call appchange()? – Karlan Sep 15 '19 at 15:51
  • the whole architecture is not really suitable for this nor user friedly. You should put some console.log statements to look whats INSIDE "a" after your first input. A better way would be to let alertify display a simple form. to get all 3 variables. May look not THAT cool buts way more handy. One call and all things are done. – Thomas Ludewig Sep 15 '19 at 15:58
  • I call appchange from a html button. – Brian Baldner Sep 15 '19 at 15:59
  • @ThomasLudewig How do I make a form in Alertify – Brian Baldner Sep 15 '19 at 16:04
  • What you want is, I think, to start the appchange prompt, and then in a callback start the second prompt (linkURL()). But what I see in the developer tools is that the first prompt/alert is added to the DOM. And after the input is submitted, the prompt/alert is getting hided but not destroyed. I think want you want to do is not possible with this library (I am not sure because it is the first time I see it). – Karlan Sep 15 '19 at 16:08
  • see https://stackoverflow.com/a/28280448/328072 – MK. Sep 16 '19 at 15:47

1 Answers1

0

From the alertify docs... Alertify examples (RTFM) 

            /**
             * Dialogs factory 
             *
             * @name      {string}   Dialog name.
             * @Factory   {Function} Dialog factory function.
             * @transient {Boolean}  Indicates whether to create a singleton or transient dialog.
             * @base      {String}   The name of an existing dialog to inherit from.
             *
             * alertify.dialog(name, Factory, transient, base)
             *
             */

            if(!alertify.myAlert){
              //define a new dialog
              alertify.dialog('myAlert',function factory(){
                return{
                  main:function(message){
                    this.message = message;
                  },
                  setup:function(){
                      return { 
                        buttons:[{text: "cool!", key:27/*Esc*/}],
                        focus: { element:0 }
                      };
                  },
                  prepare:function(){
                    this.setContent(this.message);
                  }
              }});
            }



            //launch it. NOTE THIS IS A STRING WITH TEXT BUT COULD ALSO BE A STRING 
            //WITH THE HTML OF YOUR FORM

            alertify.myAlert("Browser dialogs made easy!");

you could try something like this also - i am to lazy today so look for a working form sample maybee by the wizzards of google.

 <template id="myform">
    <h2>Flower</h2>
    <form name="free_willy" >  
       <input name="something" id="something" type text>
    </form>
 </template>

instead of the modern tag (see Template Tag ) you can use also:

     <div id="myform" hidden>
        <form>  ....
        </form>
     </div>

now you could do something like this

    var form_src=document.getElementById("myform").innerHTML;
    alertify.myAlert(form_src);
Thomas Ludewig
  • 696
  • 9
  • 17