conflict between JQuery slider and iui (iphone)


conflict between JQuery slider and iui (iphone)



Im trying to get a slider on an iphone web app, I'm using iui to handle the ui. The slider appears to be causing some kind of conflict with iui.js, when you drag the slider it tries to open another page. However it works fine when you just click on some part of the bar. I thought it was the slide event causing it but this event is triggered in both cases, so I'm a bit stuck. Any help would be greatly appreciated.

Simple test case (click through to get the slider):

<head>     <meta name="viewport" content="width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>      <script type="application/x-javascript" src="http://www.joehewitt.com/iui/iui/iui.js"></script>     <link href="http://www.joehewitt.com/iui/iui/iui.css" type="text/css" rel="stylesheet" />      <script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script>     <script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.core.js"></script>     <script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.slider.js"></script>     <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" />      <script language="javascript">     	$(document).ready(function(){     		$("#slider").slider()     	});     </script> </head> <body>     <div class="toolbar">     	<h1 id="pageTitle"></h1>     	<a id="backButton" class="button" href="#"></a> 	</div>     <ul title="slider test" selected="true">      	<li class="group">Page 1</li>		     	<li>     		<a class="mainnav" href="#page2">page 2</a>     	</li> </ul>     <div id="page2" title="foo.inc">     	<div id="slide_container">     		<div id="slider"></div>     	</div>     </div> </body> 



xcode gives syntax error on cpp code

1:



Generate Xml
I'm not familiar with iui, but when you wrote:.
How to resolve 'unrecognized selector sent to instance'?
but this event is triggered in both cases.
How do I enable directional lock for a UIScrollView?
I think you missed something (which may well explain your problem).


What mode to use to decrypt RSA message from iPhone in Java?
If you look at the slider's code, you'll see that mouse drags do have a different set of events that are triggered; look at "_mouseCapture" and "_mouseDrag".


What's this {{0,0},{w,h}} doing?
_mouseDrag does trigger "_slide", but it also triggers "_normValueFromMouse" first.


Getting phone UUID through iPhone SDK
As for "_mouseCapture", it's not hooked up directly in the slider code (so evidently it's done via some general jQuery UI code), so I can't say for sure it's involved, but based on the name it seems likely that it is..
Is there a way to use C++ for iPhone development?
In any event, either _mouseDrag, _normValueFromMouse, or possibly _mouseCapture (or some function they call) seems to be calling some iui function inadvertently.

My guess would be that iui hooks up a function with the same name as a slider/jQuery UI function, and does so after jQuery UI hooks up it's stuff, and as a result the slide calls the iui function.. Imagine if a "goSomewhere" function was defined in jQuery UI, and then called by _mouseDrag.

Normally it would work fine, but if someone (iui) defined its own "goSomewhere" function that function would be called instead by _mouseDrag.. Alternatively, the problem might be that the slider code is calling something that doesn't result in navigating to another page normally, but does in iPhone land; however, I suspect that this isn't the case.. Hope that helps..


2:


Thanks for the help machineghost.

Incase anyone else has this problem, its caused by the iui function 'addEventListener' picking up the clicks on the slider.

It the tries to set the selected attribute on the tag '#', which breaks the page.

You can check if the tag is a real one before allowing this to continue, not a perfect fix but it works..



60 out of 100 based on 45 user ratings 1220 reviews