opitzconsulting / jquery-mobile-angular-adapter

jquery mobile angular adapter
MIT License
517 stars 114 forks source link

JQM 1.3 selectmenu error #128

Closed jgrenon closed 11 years ago

jgrenon commented 11 years ago

I have a simple selectmenu in a JQM 1.3 page.

<div data-role="fieldcontain">
   <label for="instrument" class="select">Instrument:</label>
    <select id="instrument" ng-model="signal.instrument" ng-options="i.label for i in instruments"></select>
</div>

The generated HTML code seems to be fine :

<div data-role="fieldcontain" class="ui-field-contain ui-body ui-br">
    <label for="instrument" class="select ui-select">Instrument:</label>
    <div ngm-create="{&quot;selectmenu&quot;:[]}" class=" ui-select">
        <select id="instrument" ng-model="signal.instrument" ng-options="i.label for i in instruments" ngm-link="{&quot;selectmenu&quot;:true}" class="ng-pristine ng-valid">      
           <option value="?" selected="selected"></option>
           <option value="0">EUR/USD</option>
          <option value="1">GBP/USD</option></select>
    </div>
</div>

But I there's no select widget displayed on the page. In the Javascript console, I get the following error :

TypeError: Cannot read property 'close' of undefined
    at patch (file://localhost/Users/joelgrenon/products/mobile/btm/app/lib/jquery-mobile-angular-adapter-1.2.1-SNAPSHOT.js:17:23)
    at HTMLDocument.menuPage (file://localhost/Users/joelgrenon/products/mobile/btm/app/lib/jquery-mobile-angular-adapter-1.2.1-SNAPSHOT.js:26:9)
    at HTMLDocument.b.event.dispatch (file://localhost/Users/joelgrenon/products/mobile/btm/app/lib/jquery-1.9.1.min.js:3:28337)
// patch for selectmenu when it opens a menu in an own page
$( document ).bind( "selectmenubeforecreate", function( event ) {
   var selectmenuWidget = $( event.target ).data( "selectmenu" );
   patch(selectmenuWidget, 'close', function (old, self, args) {
      if (self.options.disabled || !self.isOpen) {
         return;
      }
      if (self.menuType === "page") {
                // See mobile.dialog#close for the same logic as here!
                var dst = $.mobile.urlHistory.getPrev().url;
                if (!$.mobile.path.isPath(dst)) {
                    dst = $.mobile.path.makeUrlAbsolute("#" + dst);
                }

                $.mobile.changePage(dst, { changeHash:false, fromHashChange:true });
                self.isOpen = false;
            } else {
                old.apply(self, args);
            }
        });
});

selectmenuWidget is undefined as if the underlying HTML control wasn't enhanced by jQM.

Has anyone succeeded in create a selectmenu with jQM 1.3? If so could you share you markup and any specific steps to get it working.

tbosch commented 11 years ago

Hi, thanks for submitting. I will care for the jqm 1.3 issues soon, promised :-)

Tobias

jgrenon commented 11 years ago

I've committed a workaround for the problem I raised last week. If you're interested, it's in my fork, simple change in event semantic I think.

On 2013-03-01, at 10:53 AM, Tobias Bosch notifications@github.com wrote:

Hi, thanks for submitting. I will care for the jqm 1.3 issues soon, promised :-)

Tobias

— Reply to this email directly or view it on GitHub.

tbosch commented 11 years ago

Hi, with my last commit I updated to jqm 1.3. Here is a jsfiddle showing your example, which works: http://jsfiddle.net/ZHKBA/112/

Could you double check with the current snapshot version?

Thanks, Tobias

tbosch commented 11 years ago

Closing this, preparing for release 1.3.0 of the adapter.