Software Archive
Read-only legacy content
17061 Discussions

Framework 7 alert prompt twice

Arthur_T_
New Contributor I
573 Views

I'm newbie on XDK. I created a new project as Blank Standard HTML5 using App Designer, Framework 7, XDK version 3088 (run on iMac OS EL Capitan). Then I drap a button on the mainpage of index.html with custom script:

/*jshint browser:true */
/*global $ */(function()
{
 "use strict";
 /*
   hook up event handlers
 */
 function register_event_handlers()
 {
    
    
     /* button  Login */
    $(document).on("click", ".uib_w_1", function(evt)
    {
        /* your code goes here */
        alert('abc');
    });
    
    }
 document.addEventListener("app.Ready", register_event_handlers, false);
})();


When I 'run' it on iOS device in Debug tab, it prompt twice when click on the button. However, if I 'debug' it on iOS device in Debug tab, it prompt only once. Anything wrong?

0 Kudos
10 Replies
Elroy_A_Intel
Employee
573 Views

What is your experience when using the Test Tab or on device via the Build tab?

0 Kudos
PaulF_IntelCorp
Employee
573 Views

If you are starting out we recommend you use Twitter Bootstrap. See this FAQ for additional info > https://software.intel.com/en-us/xdk/faqs/app-designer#best-app-designer-framework

0 Kudos
Arthur_T_
New Contributor I
573 Views

Thanks Elroy Ashtian Jr. Still prompt twice when I'm using the ipa that generated from Build tab. I haven't try on Test tab but I got this behavior. When using the ipa (for iOS device) that generated from Build Tab, if I tap on the button fast enough after open the app, it will only prompt once.

Thanks Paul F. I'm using Twitter Bootstrap at the very beginning (I choose it because I have a research on responsive mobile framework). I switched to Framework 7 just because its look and feel more modern like iOS7 especially on table. Now base on your information, seems Framework 7 is not a good start.

0 Kudos
PaulF_IntelCorp
Employee
573 Views

There are Bootstrap themes you can get to change the look and feel. You'll have to search the web for them.

0 Kudos
Geoff_at_CFM
Beginner
573 Views

You should consider updating your tutorials - all us beginners are using Framework 7 because that is what is shown in the tutorials, with the presenter saying what a great framework it is!

0 Kudos
Arthur_T_
New Contributor I
573 Views

HI, Elroy Ashtian Jr., seems I should use Framework 7 provided alert instead of standard alert. i.e. using

myApp.alert("message", "title");

instead of

alert("message");

Then the message only prompted once.

0 Kudos
PaulF_IntelCorp
Employee
573 Views

@Geoff -- I'll see if we can get a Bootstrap + App Designer tutorial put together.

0 Kudos
Arthur_T_
New Contributor I
573 Views

Hi Paul F., how to integrate the Bootstrap theme that I found from internet to XDK s.t. I can select from App Designer's themes if the project using Twitter Bootstrap?

Also, how can I do screen transition animation if I using Twitter Bootstrap? e.g. slide / fade like the one in App Framework 3

When I'm using App Framework 3, how can I have screen transition animation but the new page in another html file? I tried to define the new page in index.html but specify it's panel content come from another html, but not work:

in index.html

...

<a class="button widget uib_w_4 d-margins" data-uib="app_framework/button" data-ver="2" href="#uib_page_1" data-transition="slide" data-page-type="document_page">Login</a>

...

<div class="upage vertical-col left view" id="uib_page_1" data-header="none" data-footer="none">
            <div class="pages">
                <div class="upage-content vertical-col left panel ac0" id="uib_page_2" data-include="launcher.html"></div>
            </div>
</div>

it can slide to uib_page_2 but nothing show in that page, so I try to make launcher.html only contain this text: "testing" but still nothing to show

0 Kudos
Chris_P_Intel
Employee
573 Views

What type of Bootstrap theme is it? Most Bootstrap themes these days are not just a .css file but a pre-built page template with matching  CSS.  If yours is one of those page templates, you won't be able to use it with the App Designer.  

The animations between pages are provided (or not) by the individual frameworks. Bootstrap doesn't have those animations predefined. (Unlike App Framework or jQueryMobile).  

 

0 Kudos
Arthur_T_
New Contributor I
573 Views

Thanks, forget about my questions on Bootstrap as I won't choose it if there is no screen transition animation out of the box. (ps: the Bootstrap theme I found with 3 directories: css, fonts, js and I replace those in cerulean which is one of the build-in theme of Bootstrap, so I can see the effect of this new 'ios' style theme, but it didn't on table like Framework7 does)

Then I will choose either Framework7 or App Framework. Most probably I will choose Framework7 after read online document: http://framework7.io/docs

0 Kudos
Reply