Search jQuery

jQuery Forum

Screen name:
dayv2005

dayv2005's Profile

11 Posts

39 Responses

0 Followers

Activity Trend

Last 30 days

Loading Chart...

Show:

Expanded view
List view

JQM working in Google Apps Script?
[2Replies]
- 29-Nov-2012 11:30 AM
- Forum: jQuery Mobile
I'm using the latest release to do some testing in google apps script web app. But JQM styles seem to not be rendered and I was wondering if anyone here has got this to work with it yet?

Here's my code.
2. <!DOCTYPE html>
3. <html>
4. <head>
5. <title>My Page</title>
6. <meta name="viewport" content="width=device-width, initial-scale=1">
7. <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
8. <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
9. <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
10. </head>
11. <body>
13. <div data-role="page">
15. <div data-role="header">
16. <h1>My Title</h1>
17. </div>
19. <div data-role="content">
20. <p>Hello world</p>
21. </div>
23. </div>
25. </body>
26. </html>

Navbar plus Fixed Position header causing issues on android.
[1Reply]
- 23-Apr-2012 01:56 PM
- Forum: jQuery Mobile
I don't have a sample markup for this yet but could produce one if this isn't know. I have fixed headers and footers using 1.1. I have a nave bar attached to the bottom of the header so that i scrolls up and down with the header accordingly.

However, on an Android device when testing this out if one of the navbar buttons is sitting over top a form element such as a select, then when the navbar button is clicked the event for that button doesn't fire off but yet entry is applied to the form element. Has anyone else noticed this? If not I will post a markup of it on here.

[Beta 3] List Divider Button Not Firing in Grade A Browsers?
[0Replies]
- 26-Sep-2011 01:27 PM
- Forum: jQuery Mobile
I noticed that, if you have a button nested inside the list item in a list view and you are viewing it in a grade A browser, the click never fires.

I tried this with the latest code and still had the same issue as I did with Beta 3. I created a JSBin for it too.

Basically the delete button on this example will only fire off if the browser isn't grade A. I was using the built in eclipse browser when i noticed this. It's an older version of IE that isn't grade A.

This doesn't fire off in chrome or IE9. But it does in IE7 or 6.

Can anyone help me out with this issue?

http://jsbin.com/ozerik/64/

** EDIT **

Looks like you can get it to fire by hover over the top of the button's circle border. But is still a pain in the but.

Can't pass function as a parameter and call it.
[5Replies]
- 02-Aug-2011 02:47 PM
- Forum: Using jQuery
I'm trying to pass locally defined function as a parameter. Every time I do it, it causes an error saying something along the lines of "there is no conversion for text to function".
1. $(document).ready(function(){
2. jQuery("#confirm-ajax-submit").click(function(event){
3. var success = function(){
4. alert("this is what I want to see.");
5. };
6. callThis(success);
7. return false;
8. });
10. });
12. function blah(success){
13. success;
14. // or $(success);
15. }

How to correctly override a button link (overrode link doesn't work on Android Device)
[1Reply]
- 08-Jul-2011 11:02 AM
- Forum: jQuery Mobile
I have this multipage layout that is set up like a wizard. (Step1, Step2, Step3, etc).

It looks like this.

The back and next links work fine on all desktop browsers. However the next links on each page does specific ajax calls to the server for getting info and validation. The back buttons work fine on the android device, but that's because they are hard coded links looking like this
1. <a href="#aim-home" id="unit-number-left-link" data-direction="reverse" data-transition="slide" data-icon="back">Back</a>
These links work perfect on the android device. However it's the NEXT links that aren't working properly on the device and I think that's because i'm setting the href="#" and then overriding it with a jquery click event. Like this

The link markup
1. <a href="#" id="unit-number-right-link" data-transition="slide" data-icon="forward">Next</a>
The javascript
2. $('#unit-number-right-link').click(function(event){
3. var url = jQuery(location).attr('href');
4. var unit = jQuery('#unit-number');
5. var ajaxData = 'unit-number-right-link=1&actionLink=link';
6. ajaxData+='&'+unit.attr('name')+'='+unit.attr('value');
7. jQuery.get(url, ajaxData, function(data) {
8. var json = jQuery.parseJSON(data);
9. var errorCode = json.error.code;
10. var isError = (json.error.code != 0) ? true : false;
11. var results = (json.result == "null") ? null : json.result;
12. if (isError){
13. aimDisplayError(json.error.message);
14. } else {
15. if (results != null){
16. var options = '';
17. options += "<option value='' data-domicile=''>Select</option>";
18. $('#company-contract').val('');
19. $.each(results, function(i, item) {
20. var values = results[i].values;
21. options += "<option value='" + values.custprefix+'-'+values.custid+'-'+values.custsuffix + "' data-domicile='" + values.domid + "' data-domicilename='" + values.domname + "' >" + values.custname + "</option>";
22. });
23. $('#company-contract').html(options);
24. $('#company-contract').val('');
25. $('#company-page-unit-number-span').html(unit.val());
26. $.mobile.changePage($('#company-page'));
27. $('#company-contract').selectmenu('refresh', true);
28. }
29. }
30. });
31. });
This link is kind of working, sometimes i have to hit it like 100 times and it finally fires off and never fires and error message.

Has anyone else had this issue?

Back Button causes a bunch of space in List Items [BETA 1]
[2Replies]
- 23-Jun-2011 02:46 PM
- Forum: jQuery Mobile
Here's my markup for a menu that is a list view.
1. <ul id="publicMenu" data-role="listview" data-inset="true">
2. <li data-role="list-divider">Public</li>
3. <li><a href="/intranet/mobile/module/news/news.htm">News</a></li>
4. <li><a href="/intranet/mobile/module/contact/contact.htm">Contact Us</a></li>
5. </ul>
When I click on the news link it redirects me to the correct page (using ajax navigation). That looks all good but when I click the back button on the browser it takes me back to the original page and now the New ListItem takes up the entire page almost as if it generated a bunch of breaks in the listItem.
If I disable ajax then it works fine. Seems to be an issue when redrawing the page. Also what ever ListItem link i click on is the one that is enlarged when I return to that page.

This is what it looks like normally.

This is what it looks like when I click the back button.

Is anyone else experiencing this problem? Am I missing something.

List of data roles and available attributes?
[2Replies]
- 17-Jun-2011 11:21 AM
- Forum: jQuery Mobile
I was wondering if there was a list out there of all the available data-roles and their corresponding attributes? I am trying to clean up my 3rd party integration and want to things a little more tidy and support everything available after the beta release.

Thanks.

jqXHR.responseText is empty in IE
[2Replies]
- 10-Jun-2011 12:47 PM
- Forum: Using jQuery
When I run this on chrome it works fine and get the correct value for the responseText. I happened to run it in IE via the built in Eclipse Browser (i think version 7) and Desktop version 8 and noticed that the responseText is empty in IE. I am running jquery 1.5.2 .

Any ideas out there how to modify this to get it to work with both IE and everything else.

Thanks
1. $(document).ready(function() {
  $('#myajaxform_submit').click(function() {
  postForm(event);
  return false;
  });
  });
  
  // Processes the form
  function postForm(event) {
  var ajaxForm = jQuery('#myajaxform');
  var ajaxSubmit = jQuery(event.currentTarget);
  var ajaxUrl = ajaxForm.attr('action');
  var ajaxType = ajaxForm.attr('method');
  var ajaxData = ajaxForm.serialize();
  ajaxData+='&'+ajaxForm.attr('id')+'=1';
  ajaxData+='&'+ajaxSubmit.attr('name')+'='+ajaxSubmit.attr('value');
  jQuery.ajax({
  type: ajaxType,
  url: ajaxUrl,
  data: ajaxData,
  dataType: 'json',
  beforeSend:function(XMLHttpRequest, settings){$.mobile.pageLoading();},
  complete:function(XMLHttpRequest, textStatus){$.mobile.pageLoading(true);},
  dataFilter:function(data, type){},
  success:function(data, textStatus, jqXHR){alert(jqXHR.responseText);n},
  error:function(XMLHttpRequest, textStatus, errorThrown){}
  });
  }

Forum Link on main page is wrong.
[0Replies]
- 21-Feb-2011 09:16 AM
- Forum: jQuery Mobile
Don;t know if anyone has mentioned this yet or not. On the main page for jqm, the forum link in the green navigation bar seems to link to this..

http://forum.jquery.com/jquery-mobile

Get a 404 on that link.

The correct link should be...

http://forum.jquery.com/using-jquery-mobile/

Not a big deal but i figured i'd let you guys know. I thought the forum was down the last couple of days.

IE won't render if there is a form on the page? (GradeA Hack)
[9Replies]
- 04-Feb-2011 12:25 PM
- Forum: jQuery Mobile
I just upgraded to Alpha 3. In Alpha 2 i used this snippet to enable jqm for IE.
2. gradeA: function(){
3. //IE version check by James Padolsey, modified by jdalton - from http://gist.github.com/527683
4. var ie = (function() {
5. var v = 3, div = document.createElement('div'), a = div.all || [];
6. while (div.innerHTML = '', a[0]);
7. return v > 4 ? v : !v;
8. }());
9. //must either support media queries or be IE7+
10. return $.support.mediaquery || (ie && ie >= 7);
11. }
Now since I have updated to Alpha 3, I am still using this to bind to mobileInit. It seems to work fine except on pages that are using forms. When i access a page that uses a form and enables IE i get a blank white page with an error. The error seems to be with Jquery and was wondering what the fix could be for this.

This is the error that I get
2. Webpage error details
4. User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; OfficeLiveConnector.1.4; OfficeLivePatch.1.3; .NET4.0C)
5. Timestamp: Fri, 4 Feb 2011 17:23:16 UTC
8. Message: Object doesn't support this property or method
9. Line: 16
10. Char: 44795
11. Code: 0
12. URI: http://localhost:8080/intranet/mobile/assets/js/jquery-1.5.min.js
Also tried this with jquery 1.4.4 and the 1.5 can someone help me out on this issue? If you need more info just let me know.

Thanks.

When I use page() the input elements background changes

[0Replies]

25-Jan-2011 12:15 PM
Forum: jQuery Mobile

I have set ajaxLinksEnabled : false, ajaxFormsEnabled : false. I want to handle my own custom ajax for this application. I am replacing the current form with another form that is sent via servlet response. I discovered that the styles weren't loading and found out to use this.

jQuery("#aim-home").page("destroy").page();

now the problem i have is that my input color changed to a darker color when calling the above code on my ajax complete function.

Normal Picture:

After .page() (not normal)

Can't figure out how to fix this. Any idea?

code:

	<!DOCTYPE html>
	<html>
	<head>
	<title>AIM - DvcrEntry</title>
	<link href="/intranet/click/control.css" rel="stylesheet" type="text/css"/>
	<link href="/intranet/mobile/assets/css/aim-mobile.css" rel="stylesheet" type="text/css"/>
	<link href="/intranet/mobile/assets/css/jquery.mobile-1.0a2.min.css" rel="stylesheet" type="text/css"/>
	<script src="/intranet/click/control.js" type="text/javascript"></script>
	<script src="/intranet/mobile/assets/js/jquery-1.4.4.min.js" type="text/javascript"></script>
	<script src="/intranet/mobile/assets/js/jqm-mobile-config.js" type="text/javascript"></script>
	<script src="/intranet/mobile/assets/js/jquery.mobile-1.0a2.min.js" type="text/javascript"></script>
	<script src="/intranet/mobile/assets/js/aim-mobile.js" type="text/javascript"></script>

	<script type="text/javascript">
	$(function() {
	$('#myajaxform').submit(function(e) {
	jQuery.ajax({
	type: $(this).attr("method"),
	url: $(this).attr("action"),
	dataType: "json",
	data: $(this).serialize(),
	beforeSend:function(XMLHttpRequest, settings){},
	complete:function(XMLHttpRequest, textStatus){
	jQuery("#aim-home").page("destroy").page();
	},
	dataFilter:function(data, type){},
	success:function(data, textStatus, XMLHttpRequest){
	$('#myajaxform').html(XMLHttpRequest.responseText);
	},
	error:function(XMLHttpRequest, textStatus, errorThrown){}
	});
	e.preventDefault();
	});
	});

	</script>

	</head>
	<body>
	<div name="aim-home" id="aim-home" data-role="page" data-theme="b">
	<div data-role="header" data-theme="b">
	<a href="/intranet/mobile/module/dvcr/dvcrmenu.htm" data-icon="back">Back</a>
	<h1>AIM - DvcrEntry</h1>
	<a href="/intranet/mobile/module/dvcr/dvcrentry.htm?actionLink=loginLink" data-icon="gear">Login</a>
	</div>
	<div data-role="content">
	<form name="myajaxform" id="myajaxform" method="post" name="myajaxform" id="myajaxform" action="/intranet/mobile/module/dvcr/dvcrentry.htm">
	<div data-role="fieldcontain" style="display:none;">
	<label for="step">
	Step
	</label>
	<input type="hidden" name="step" id="myajaxform_step" value="1"/>
	</div>
	<div data-role="fieldcontain">
	<label for="unitNum">
	Unit Number:
	</label>
	<input type="text" name="unitNum" id="myajaxform_unitNum" value="" size="20"/>
	</div>
	<div class="ui-body ui-body-b">
	<fieldset class="ui-grid-a">
	<div class="ui-block-a">
	<a data-theme="b" class="ui-btn ui-btn-corner-all ui-shadow ui-btn-up-b" role="button" href="/intranet/mobile/module/dvcr/dvcrmenu.htm" aria-label="Cancel">
	<span class="ui-btn-inner ui-btn-corner-all">
	<span class="ui-btn-text">
	Cancel
	</span>
	</span>
	</a>
	</div>
	<div class="ui-block-b">
	<input type="submit" name="submit" id="myajaxform_submit" value="Submit" onclick="alert('clicked');"/>
	</div>
	</fieldset>
	</div>
	<input type="hidden" name="form_name" id="myajaxform_form_name" value="myajaxform"/>
	<input type="hidden" name="bypass_validation" id="myajaxform_bypass_validation" value="false"/>
	</form>
	</div>
	<div data-role="footer">
	<h4> </h4>
	</div>
	</div></body>
	</html>

«Prev
Next »

Response title

Attachments

jQuery Forum

Activity Trend