Difference between revisions of "Webeshoppin"
From Wiki2
| Line 76: | Line 76: | ||
====[jqm] How do you add an element programmatically with all the css?==== | ====[jqm] How do you add an element programmatically with all the css?==== | ||
=====ANSWER: Add all the classes to it that you see in developer tools elements.===== See http://10.0.1.18/webeshoppin/stuff2get/zmisc/add2form.html | =====ANSWER: Add all the classes to it that you see in developer tools elements.===== | ||
See http://10.0.1.18/webeshoppin/stuff2get/zmisc/add2form.html | |||
====Query's closest(selector) function==== | ====Query's closest(selector) function==== | ||
Revision as of 17:10, 31 January 2012
log
- workin on webeshppin.js#joinexist line 91? what to do based on exists.
- var cookieList = function(cookieName) {} has been changed only in lists.js
[jqm] How can I grab the searchValue?
If no items match the searchValue I want to add that searchValue to a list.
My plan is to somehow monitor the when the visible matches goes to 0 then grab the value in the filter box.
Here is my test code (it has all it needs to run) I've got the callback function part wrong.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.css" />
<script src="http://code.jquery.com/jquery.js"></script>
<script src="http://code.jquery.com/mobile/latest/jquery.mobile.js"></script>
<script>
$('#thelists').live('pageinit', function(event) {
$('body').on('click', "#getdata", function (e) {
e.stopImmediatePropagation();
e.preventDefault();
visib = $("#mylist li:visible").length;
console.log('list has ' + visib + ' elements left');
$("#mylist").listview('option', 'filterCallback', myFilterFunction);
});
function myFilterFunction( text, searchValue ){
console.log('Searching for ' + searchValue);
return text.toLowerCase().indexOf( searchValue ) === -1;
};
});
</script>
</head>
<body>
<div id="thelists" data-role="page">
<div data-role="header">
<h1>My Title</h1>
</div><!-- /header -->
<div data-role="content">
<a href="index.html" id="getdata" data-role="button">getSearchTxt</a>
<div class="content-primary">
<ul id="mylist" data-role="listview" data-filter="true">
<li><a href="index.html">Acura</a></li>
<li><a href="index.html">Audi</a></li>
<li><a href="index.html">Aukervile</a></li>
<li><a href="index.html">Auadillac</a></li>
<li><a href="index.html">Chrysler</a></li>
<li><a href="index.html">Dodge</a></li>
<li><a href="index.html">Ferrari</a></li>
<li><a href="index.html">Foraud</a></li>
<li><a href="index.html">GMC</a></li>
<li><a href="index.html">Honda</a></li>
<li><a href="index.html">Hyundai</a></li>
<li><a href="index.html">Infiniti</a></li>
<li><a href="index.html">Jeep</a></li>
<li><a href="index.html">Kia</a></li>
</ul>
</div>
</div><!-- /content -->
</div><!-- /page -->
</body>
</html>
ANSWER: Detect the keyup event of the searchbox
$("input[data-type='search']").keyup(function() {
//$("input[data-type='search']").keyup(function() {
var optCount = $("#mylist > li:visible").size();
if(optCount < 1) {
alert('Value: '+$(this).val());
}
});
[jqm] How do you add an element programmatically with all the css?
ANSWER: Add all the classes to it that you see in developer tools elements.
See http://10.0.1.18/webeshoppin/stuff2get/zmisc/add2form.html
Query's closest(selector) function
will traverse upward and return the nearest selector provided. http://api.jquery.com/closest/
$("a.removerow").click(function(e){
$(this).closest('tr').hide();
e.preventDefault();
});
to force a move with refresh
method1
location.href= 'food2buy.html?repo=' + rep + '&list=' + lis;
method2 (data-ajax="false")
$('#allyourlists').append('<li><a href="food2buy.html?repo=' + rep +
'&list=' + lis + '" data-ajax="false" >Repo: ' + rep + '& List: ' +
lis + '</a></li>');
Why doesn't the clich http://10.0.1.18/webeshoppin/stuff2get/zmisc/buttonnotfiring.html
javascript
var myCars=new Array(); // regular array (add an optional integer
myCars[0]="Saab"; // argument to control array's size)
myCars[1]="Volvo";
myCars[2]="BMW";
2:
var myCars=new Array("Saab","Volvo","BMW"); // condensed array
3:
var myCars=["Saab","Volvo","BMW"]; // literal array
click
http://10.0.1.18/webeshoppin/stuff2get/zmisc/buttonnotfiring2.html
this works
- BTW shoudn't use id for multiple items
<script>
//Why is delete button not firing?
$('#thelists').bind('pageinit', function(event) {
console.log('in bind pageinit for yourlists');
var thelists = ["list1", "list2"];
console.log(thelists);
$.each(thelists, function(index, alist) {
$('#allyourlists').append('<li><a href="index.html" data-role="button" id="delalist">List: ' + alist + '</a></li>');
});
$('#allyourlists').listview('refresh');
});
//gets the val of val1 from the previois call
$('body').on('click', "#delalist", function (e) {
e.stopImmediatePropagation();
e.preventDefault();
alert ('in delalist') ;
});
</script>
this doesn't
<script>
//Why is delete button not firing?
$('#thelists').bind('pageinit', function(event) {
console.log('in bind pageinit for yourlists');
var thelists = ["list1", "list2"];
console.log(thelists);
$.each(thelists, function(index, alist) {
$('#allyourlists').append('<li><a href="index.html" data-role="button" id="delalist">List: ' + alist + '</a></li>');
});
$('#allyourlists').listview('refresh');
});
//gets the val of val1 from the previois call
$("#delalist").click(function (e) {
e.stopImmediatePropagation();
e.preventDefault();
alert ('in delalist') ;
});
</script>
