[jQuery] CSS based Sliding menu
Hi all, I'm sure jQuery has something similar, just haven't been able to find it. There's an article/example here, and I'm sorry if this is a common question here. I wasn't sure how to search for sliding menu thingy in the threads. :-) Where should I look within jquery for a similar effect of http://devthought.com/cssjavascript-true-power-fancy-menu/ ? Cheers all. :-) - sf
[jQuery] Re: CSS based Sliding menu
Thanks for the link Cloud, perfect. :-) On 11/13/07, Cloudream [EMAIL PROTECTED] wrote: http://www.gmarwaha.com/blog/?p=7 On Nov 14, 10:54 am, Steve Finkelstein [EMAIL PROTECTED] wrote: Hi all, I'm sure jQuery has something similar, just haven't been able to find it. There's an article/example here, and I'm sorry if this is a common question here. I wasn't sure how to search for sliding menu thingy in the threads. :-) Where should I look within jquery for a similar effect ofhttp://devthought.com/cssjavascript-true-power-fancy-menu/? Cheers all. :-) - sf
[jQuery] Stripped down AJAX methods
Hey folks, Before I go through the trouble, I figured someone might have already done this so I'll ask here first. I'm looking to strip jQuery of everything but the AJAX utilities. In particular, jQuery.Ajax() should be good enough. Need this for an application which I can't load the entire library into since it'll be iPhone-centric over EDGE (yuck.) If someone has the minimum required code, that'd be excellent. If not, I'll give re-creating it a shot. :-) Cheers! - sf
[jQuery] jQuery + Select Box woes
Hi all,
I'm having some difficulty getting select boxes to function the way I
envision them to function. I'm using the Plugin available from:
http://www.texotela.co.uk/code/jquery/select/
My code looks like the following:
$(select#make).change(function() {
$.ajax({
data: {make_val: $(this).val()},
dataType: 'json',
timeout: 1,
type: 'POST',
url: /addvehicle/models_populate,
error:function() {},
success: function(json) {
json = eval(json);
var options = '';
for (var i = 0; i
json.length; i++)
{
options +=
'option value=' +
json[i]['name'].toLowerCase() + '' + json[i]['name'] + '/option';
}
$(select#model
option).not(.staticOpt).remove();
$(select#model).append(options);
} // end callback funct(json)
}); // end $.ajax
}); // end $(select#make)
// populate the trims select when model is changed.
$(select#model).change(function() {
$.ajax({
data: {model_val: $(this).val()},
dataType: 'json',
timeout: 1,
type: 'POST',
url: /addvehicle/trims_populate,
error:function() {},
success: function(json) {
json = eval(json);
var options = '';
for (var i = 0; i
json.length; i++)
{
options +=
'option value=' +
json[i]['name'].toLowerCase() + '' + json[i]['name'] + '/option';
}
if(json.length === 0) {
$(select#trim).append('option value=no trimNo
Trim/option');
$(select#trim).selectOptions(No Trim);
}
else {
$(select#trim option).not(.staticOpt).remove();
$(select#trim).append(options);
}
} // end callback funct(json)
}); // end $.ajax
}); // end $(select#model)
---
Essentially, what I'm trying to achieve is to populate a Model box
based on a Make box. At the same time, I want to populate a Trim
select box with No Trim if /addvehicle/trims_populate comes back
with a zero length json object.
What happens here though, if I change my 'Model' box, trims populate
just -fine-. However, when I change my Make select, it populates the
Trim boxes with different 'Models' where it should be populating it
with Trims. I need to change a 'Model' again to populate it with the
proper trims. I know it's rather confusing, and I appreciate it if
anyone can give me any hints.
Cheers all,
- sf
[jQuery] Re: jQuery + Select Box woes
Aa, I spoke too soon. I wish I can discard this message to avoid
spamming an already busy discussion group. This one was tough to
catch, but if you notice in my code example above, json is globally
scoped across both of my functions. I had to explicitly declare it
locally with 'var' and now my code is behaving more proper.
Thanks again all. :-)
- sf (still loving jQuery, just still sucking at JavaScript. :-) )
On 10/23/07, Steve Finkelstein [EMAIL PROTECTED] wrote:
Hi all,
I'm having some difficulty getting select boxes to function the way I
envision them to function. I'm using the Plugin available from:
http://www.texotela.co.uk/code/jquery/select/
My code looks like the following:
$(select#make).change(function() {
$.ajax({
data: {make_val: $(this).val()},
dataType: 'json',
timeout: 1,
type: 'POST',
url: /addvehicle/models_populate,
error:function() {},
success: function(json) {
json = eval(json);
var options = '';
for (var i = 0; i
json.length; i++)
{
options +=
'option value=' +
json[i]['name'].toLowerCase() + '' + json[i]['name'] + '/option';
}
$(select#model
option).not(.staticOpt).remove();
$(select#model).append(options);
} // end callback funct(json)
}); // end $.ajax
}); // end $(select#make)
// populate the trims select when model is changed.
$(select#model).change(function() {
$.ajax({
data: {model_val: $(this).val()},
dataType: 'json',
timeout: 1,
type: 'POST',
url: /addvehicle/trims_populate,
error:function() {},
success: function(json) {
json = eval(json);
var options = '';
for (var i = 0; i
json.length; i++)
{
options +=
'option value=' +
json[i]['name'].toLowerCase() + '' + json[i]['name'] + '/option';
}
if(json.length === 0) {
$(select#trim).append('option value=no trimNo
Trim/option');
$(select#trim).selectOptions(No Trim);
}
else {
$(select#trim option).not(.staticOpt).remove();
$(select#trim).append(options);
}
} // end callback funct(json)
}); // end $.ajax
}); // end $(select#model)
---
Essentially, what I'm trying to achieve is to populate a Model box
based on a Make box. At the same time, I want to populate a Trim
select box with No Trim if /addvehicle/trims_populate comes back
with a zero length json object.
What happens here though, if I change my 'Model' box, trims populate
just -fine-. However, when I change my Make select, it populates the
Trim boxes with different 'Models' where it should be populating it
with Trims. I need to change a 'Model' again to populate it with the
proper trims. I know it's rather confusing, and I appreciate it if
anyone can give me any hints.
Cheers all,
- sf
[jQuery] Strip library for certain functionality, possible?
Hi all, As much as I love loading all of jQuery into every single web project I'm involved in, this current one is for an iPhone catered web application. And to be quite blunt, loading anything over EDGE is painful. I'd like to still use a few methods available, such as jQuery.Ajax(). Is there a 'proper' way of using just that functionality on a site instead of loading the whole library? I've seen folks load libraries in their script tags using something like: jquery.js?arbitrary_stuff_here but I'm not sure what that does. Although I'm hoping it does what I need it to do. Thanks for any insight all. - sf
[jQuery] iTunes album flipping simulation
Greetings all! This might be more UI related, and if it is, apologies for spamming this list. I'm surfing iTunes album art flipping, the same thing that's on the iPhone, and I believe amazon has something very similar (but theirs is done in flash. :-( ) I was curious if any of the brilliant minds who contribute to jQuery have created a similar widget yet with JavaScript? I suppose it would be like a Carousel on steroids. :-) Thanks again anyway for any input. - sf
[jQuery] Site Submission, finally!! :-)
Wow, I feel like I just gave birth. So there's certainly some bugs left which I'm tweaking out, but I've finally delivered not only my first web application -- but also a jQuery powered one (using the lovely Code Igniter as my backend)! A little background and some words of inspiration. On resume, I'm a systems administrator / network engineer. I was recently approached by an individual I went to highschool with that just remembers me being a typical computer geek and asked me if I can program. I told him I'm up for any challenge and alas the following was born: http://www.f1autoimports.com I've always had a background in programming with my CS education and ofcourse, writing automated scripts in any systems/network environment I've been thrown at, mostly perl/bash based. Let me tell you, never have I had more fun before, despite all the cross browser frustrations when writing front-end code, than doing web development. I'm slowly switching my career to doing development full time and hoping I have the opportunity to code more sites. The design here has been mostly put together by a colleague of mine -- I did all of the javascript/PHP/database design, he did 90% of the CSS/HTML, I did the other 10%. Most of the juice for this site is in the administrative lounge. For obvious reasons I can't deliver f1auto's, but I do have a demonstration site up anyone can login to and have fun with at: http://devel.phpgeek.org/console login: admin pass: f1auto There's a mixture of jQuery+ExtJS objects floating around the site. This thing also pushes all of this companies inventory AUTOMAGICALLY every morning through a cron job to autotrader.com and cars.com. They no longer have to put in their inventory manually! I plan on writing an eBay extension soon as well using their API. Wow, there's still a lot of room for improvement. But I'm excited as hell. Nothing like getting paid to do what you love. I can't wait to be doing this full time. Leave some love! :-) If you've got hate, leave it also, it'll give me more inspiration to work harder on bug fixes and my next project. :-) -- Steve Finkelstein zuez on EFnet / FreeNode IRC
[jQuery] Re: Site Submission, finally!! :-)
Thanks Steve! Yeah. I've made note to the client regarding purchasing an SSL certificate. I told them I'd be more than happy to embed a self-signed certificate -- but I know the minute the finance page starts getting pop-ups, they're going to complain. They're going to pay for a certificate when they've officially launched the site on their end (they haven't done any advertising for it yet... I just put it up on the domain live for testing ...) Oh, and I also did tell them the music on the landing page is obtrusive and very annoying for any user who doesn't have the option to turn it off. I guess it's what they want, and they're paying me to do it, so as long as it's not illegal, I do it. :-) Thanks so much for the positive feedback! - sf On 10/9/07, Steve Blades [EMAIL PROTECTED] wrote: Steve, Very nice work, looks fantastic. And that's coming from a guy who works for a company that targets this (auto dealers) industry exclusively. Few minor notes: Your finance application is on an unsecure page. Major red flag to a savvy user, and huge liability to yourself (as the developer) and your buddy/client. You also want to make sure that you never email the full contents of that form, and that you encrypt any personal data entered to your db, then decrypt them in a secure (https) admin interface for your client (trust me on this, you don't want the headaches if you don't). Also, you may want to offer a compacted listings view, something pertinent, but truncated, that expands on click or on mouseover. Check out the ZoomBox Plugin for handling the listing image in that situation (should you consider it). Also consider centering your finance form (I'm looking in Firefox). Looks really good. Glad you had fun with it. Isn't JQuery the bomb? -- Steve Cutter Blades Adobe Certified Professional Advanced Macromedia ColdFusion MX 7 Developer _ http://blog.cutterscrossing.com --- The Past is a Memory The Future a Dream But Today is a Gift That's why they call it The Present
[jQuery] Re: Problems with Firefox
You're going to need to at least provide some code if you want a decent response from anyone. Sent from my iPhone On Oct 6, 2007, at 8:26 PM, tramblie [EMAIL PROTECTED] wrote: Several JQuery APIs won't work with Firefox (2.0.0.7). Has someone noticed the same problem? Is it a bug, an incompatibility or what?
[jQuery] Re: thumbnails in jCarousel inquiry
Thank you Jan!
I'll take a peak.
Cheers!
- sf
On 10/5/07, Jan Sorgalla [EMAIL PROTECTED] wrote:
Hi,
Steve Finkelstein schrieb:
Hi all,
My thumbnails in jCarousel are distorting the aspect ratio of my
photos. Here's an example:
http://www.f1autoimports.com/inventory/single/11
Would anyone be kind enough to tell me how I can re-adjust the default
size to make this look more 'proper' per se?
Thanks. :-)
- sf
you can adjust the item width in skin.css:
.jcarousel-skin-ie7 .jcarousel-item {
width: 75px;
height: 75px;
border: 1px solid #fff;
}
After you changed the width, you should also adjust the width of the
clip and container of the the carousel:
.jcarousel-skin-ie7.jcarousel-container-horizontal {
width: 245px;
padding: 20px 40px;
margin-left: 5px;
margin-right: 5px;
}
.jcarousel-skin-ie7 .jcarousel-clip-horizontal {
width: 245px;
height: 77px;
}
Jan
[jQuery] Re: [Site Submission]: nbc.com
Dang, I really like the mouseover menu they have on their landing page. Is that just simple CSS? On 10/4/07, John Resig [EMAIL PROTECTED] wrote: Maybe we can get John on Jay Leno... That would be the most boring late night interview, ever. :-P --John
[jQuery] thumbnails in jCarousel inquiry
Hi all, My thumbnails in jCarousel are distorting the aspect ratio of my photos. Here's an example: http://www.f1autoimports.com/inventory/single/11 Would anyone be kind enough to tell me how I can re-adjust the default size to make this look more 'proper' per se? Thanks. :-) - sf
[jQuery] Re: jQuery 1.1.2 + jQuery carousel, help appreciated. :-)
Apologies for replying to my own thread, but I'm getting closer on the bug,
The callback function here is where the issue occurs:
function mycarousel_itemLoadCallback(carousel, state)
{
for (var i = carousel.first; i = carousel.last;
i++) {
if (carousel.has(i)) {
continue;
}
if (i mycarousel_itemList.length) {
break;
}
// Create an object from HTML
var item =
jQuery(mycarousel_getItemHTML(mycarousel_itemList[i-1])).get(0);
// Apply thickbox
tb_init(item);
carousel.add(i, item);
}
};
Just from debugging that, on initial page load, only the first three
items are getting passed to tb_init(); I have to flicker through the
rest of the carousel for more images to get appended to tb_init. I
should probably remove tb_init from this callback construct and
execute it in an anonymous function which populates all of the images
in tb_init() unless someone has a more appropriate suggestion?
- sf
On 9/27/07, Steve Finkelstein [EMAIL PROTECTED] wrote:
Hi all!
Thank you for peeking inside of my post. Anyhow, so I got a
semi-functional carousel up at:
http://devel.phpgeek.org/inventory/single/1
My only issue here is, if you click on an image within the scroll
wheel (but do not yet scroll through past the first three images...),
you'll notice that within the inline popup div, you may only navigate
through the first three photos.
You can only receive links past the first three photos if you scroll
them through the carousel first. I'm assuming something is not
populating an array until this step is completed.
If anyone can help me catch exactly where it is that I'm making the
mistake, I'd really appreciate it. The source is viewable right within
the page.
Thank you kindly for any possible hints/clues as to how I can resolve this
bug.
- sf
[jQuery] an Undo plugin, or something as such. :-)
Hi all, I was curious if there is anyone currently working on an 'Undo' type plugin for the jQuery platform. Essentially, similar functionality to what gmail offers is desired by many. If not in the works, I wouldn't mind giving it a shot myself. Thanks for any insight. - sf
[jQuery] Rudimentary jQuery question
Hi all,
So I'm trying to do something rather simple, but having difficulty
accomplishing it. I'm basically giving the user an option to delete a
row from a table within a div, using something similar to this on the
server-side:
if(mysql_num_rows($result) == 0) { exit; }
$html = 'table';
$html .= 'tr';
// count here basically just keeps track of a
// neatly aligned table
$count=0;
foreach($alpha_notes as $note) {
$html .= tda href=\javascript:void(0);\
onclick=\removeNote('.$note[ID].','.$note[NAME].')\delete/anbsp;nbsp;$note[NAME]/td;
$count++;
if(($count % 2 == 0)) {
$html .= /trtr;
}
}
$html .= '/tr/table';
My issue is, if the user has deleted their 'last' available row, I
want something to come up such as This table has no more information
left. I tried doing that with the following:
function removeNote(id,name) {
if(confirm(Are you sure you wish to delete: +name+?)) {
// ajax code here to remove note.
$.ajax({
url: /dbserver.php,
type: POST,
data: delete=+id+db=alpha,
cache: false,
success: function(html) {
if(html===FALSE) {
$(alpha_notes).empty().insert(There are no
notes left in alpha.);
} else {
$(#alpha_notes).empty().append(html);
}
}
});
}
}
Any idea where I went wrong here? I'm assuming it's causing I'm
returning a data type of HTML so my if() construct here doesn't
logically make sense.
- sf
[jQuery] Re: Rudimentary jQuery question
, there's
currently zero notes on alpha.; exit;}
// at this stage we should already have the available
// alpha notes from the code above. Let's populate the HTML
// to spit back into $html.
$html = 'table';
$html .= 'tr';
// count here basically just keeps track of a
// neatly aligned table
$count=0;
foreach($alpha_notes as $note) {
$html .= tda href=\javascript:void(0);\
onclick=\removeNote('.$note[ID].','.$note[NAME].')\delete/anbsp;nbsp;$note[NAME]/td;
$count++;
if(($count % 2 == 0)) {
$html .= /trtr;
}
}
$html .= '/tr/table';
// send this sucker back to the view.
echo $html;
}
// If brocas has notes, which it always should,
// spit them back to div id=brocas_notes
if($_POST['db']=='brocas') {
$html = 'table';
$html .= 'tr';
// count here basically just keeps track of a
// neatly aligned table
$count=0;
foreach($brocas_notes as $note) {
$html .= tda href=\javascript:void(0);\
onclick=\pushNote('.$note[ID].','.$note[NAME].')\push/anbsp;nbsp;$note[NAME]/td;
$count++;
if(($count % 2 == 0)) {
$html .= /trtr;
}
}
$html .= '/tr/table';
echo $html;
}
if($_POST['delete']) {
global $alpha_notes;
$db = mysql_select_db($db_alpha, $link);
if(!$db) {
die(Can't connect to alpha, please contact steve.);
}
$sql = DELETE from ms_notes
WHERE ID='.$_POST['delete']
.' LIMIT 1;
$result = mysql_query($sql);
if(!$result) { die(Something is broken... ); }
$sql = SELECT NAME,ID from ms_notes;
$result = @mysql_query($sql);
if(mysql_num_rows($result)==0) { $html = There are zero notes
left to process in Alpha's database; echo $html; exit; }
$html = 'table';
$html .= 'tr';
// count here basically just keeps track of a
// neatly aligned table
$count=0;
foreach($alpha_notes as $note) {
$html .= tda href=\javascript:void(0);\
onclick=\removeNote('.$note[ID].','.$note[NAME].')\delete/anbsp;nbsp;$note[NAME]/td;
$count++;
if(($count % 2 == 0)) {
$html .= /trtr;
}
}
$html .= '/tr/table';
// send this sucker back to the view.
echo $html;
}
if($_POST['push']) {
$sql = INSERT into phoenix_alpha.ms_notes
(SELECT * from phoenix_brocas.ms_notes
WHERE ID='.$_POST['push']
.' LIMIT 1);
$result = mysql_query($sql);
if(!$result) { die(Something is broken... ); }
}
?
If someone doesn't mind helping me clean this up, that would be great. :-)
On 9/24/07, Steve Finkelstein [EMAIL PROTECTED] wrote:
Hi all,
So I'm trying to do something rather simple, but having difficulty
accomplishing it. I'm basically giving the user an option to delete a
row from a table within a div, using something similar to this on the
server-side:
if(mysql_num_rows($result) == 0) { exit; }
$html = 'table';
$html .= 'tr';
// count here basically just keeps track of a
// neatly aligned table
$count=0;
foreach($alpha_notes as $note) {
$html .= tda href=\javascript:void(0);\
onclick=\removeNote('.$note[ID].','.$note[NAME].')\delete/anbsp;nbsp;$note[NAME]/td;
$count++;
if(($count % 2 == 0)) {
$html .= /trtr;
}
}
$html .= '/tr/table';
My issue is, if the user has deleted their 'last' available row, I
want something to come up such as This table has no more information
left. I tried doing that with the following:
function removeNote(id,name) {
if(confirm(Are you sure you wish to delete: +name+?)) {
// ajax code here to remove note.
$.ajax({
url: /dbserver.php,
type: POST,
data: delete=+id+db=alpha,
cache: false,
success: function(html) {
if(html===FALSE) {
$(alpha_notes).empty().insert(There are no
notes left in alpha.);
} else {
$(#alpha_notes).empty().append(html);
}
}
});
}
}
Any idea where I went wrong here? I'm assuming it's causing I'm
returning a data type of HTML so my if() construct here doesn't
logically make sense.
- sf
[jQuery] .replaceWith() broken in Firefox 2 I think
Hi all,
So I have a simple script which essentially uses .replaceWith() to
replace the containing elements HTML with a success callback. This
works fine the first time I invoke a function which calls
.replaceWith() in the success call back, but any subsequent calls
leaves the DOM unmodified.
Here's an example screenshot of what my page looks like upon a random page load.
http://catalyst.httpd.org/tmp/1.png
Ok so I have 4 notes. Let's delete one:
http://catalyst.httpd.org/tmp/2.png
Perfect, it's gone:
http://catalyst.httpd.org/tmp/3.png
Here's where the problem occurs... Let's delete another
http://catalyst.httpd.org/tmp/4.png
Hmmm, it didn't disappear from the DOM this time:
http://catalyst.httpd.org/tmp/5.png
The OB/GYN note is still there as rendered by the browser, however the
server-side script surely wiped it:
mysql select id,name from ms_notes where id=CN;
Empty set (0.00 sec)
Here's what my code looks like to remove the note:
function removeNote(id,name) {
if(confirm(Are you sure you wish to delete: +name+?)) {
// ajax code here to remove note.
$.ajax({
url: /dbserver.php,
type: POST,
data: delete=+id,
cache: false,
success: function(html) {
$(#alpha_notes).empty();
$(#alpha_notes).replaceWith(html);
}
});
}
}
Very important thing to factor in, is if I do a hard refresh on the
page, here are the results... a missing OB/GYN note, which is the way
it should be:
http://catalyst.httpd.org/tmp/6.png
Any idea folks? Would really appreciate any help. Firebug also shows
that in its response to my POST call that the notes are not there in
its table rendering. My server-side code looks like this:
if($_POST['delete']) {
global $db_alpha, $link;
$alpha_note_set = array();
$db = mysql_select_db($db_alpha, $link);
if(!$db) {
die(Can't connect to alpha, please contact steve.);
}
$sql = DELETE from ms_notes
WHERE ID='.$_POST['delete']
.' LIMIT 1;
$result='';
$result = mysql_query($sql);
if(!$result) { die(Something is broken... ); }
$sql = SELECT NAME,ID from ms_notes;
$alpha_result_set = @mysql_query($sql);
$row='';
if(mysql_num_rows($alpha_result_set)==0) { $html = There are zero
notes left to process in Alpha's database; echo $html; exit; }
while($row = @mysql_fetch_array($alpha_result_set, MYSQL_ASSOC)) {
$alpha_note_set[] = $row; }
$html='';
$html = 'table';
$html .= 'tr';
// count here basically just keeps track of a
// neatly aligned table
$count=0;
foreach($alpha_note_set as $note) {
$html .= tda href=\javascript:void(0);\
onclick=\removeNote('.$note[ID].','.$note[NAME].')\delete/anbsp;nbsp;$note[NAME]/td;
$count++;
if(($count % 2 == 0)) {
$html .= /trtr;
}
}
$html .= '/tr/table';
// send this sucker back to the view.
echo $html;
}
Thanks all.
- sf
[jQuery] Re: .replaceWith() broken in Firefox 2 I think
This is actually happening in IE7 also. Is it possible that something
is hosed with my code? I'm more confident it's that than a broken
replaceWith() but I'd really like to know why it only works once, and
then I need a page refresh for that ajax effect.
- sf
On 9/24/07, Steve Finkelstein [EMAIL PROTECTED] wrote:
Hi all,
So I have a simple script which essentially uses .replaceWith() to
replace the containing elements HTML with a success callback. This
works fine the first time I invoke a function which calls
.replaceWith() in the success call back, but any subsequent calls
leaves the DOM unmodified.
Here's an example screenshot of what my page looks like upon a random page
load.
http://catalyst.httpd.org/tmp/1.png
Ok so I have 4 notes. Let's delete one:
http://catalyst.httpd.org/tmp/2.png
Perfect, it's gone:
http://catalyst.httpd.org/tmp/3.png
Here's where the problem occurs... Let's delete another
http://catalyst.httpd.org/tmp/4.png
Hmmm, it didn't disappear from the DOM this time:
http://catalyst.httpd.org/tmp/5.png
The OB/GYN note is still there as rendered by the browser, however the
server-side script surely wiped it:
mysql select id,name from ms_notes where id=CN;
Empty set (0.00 sec)
Here's what my code looks like to remove the note:
function removeNote(id,name) {
if(confirm(Are you sure you wish to delete: +name+?)) {
// ajax code here to remove note.
$.ajax({
url: /dbserver.php,
type: POST,
data: delete=+id,
cache: false,
success: function(html) {
$(#alpha_notes).empty();
$(#alpha_notes).replaceWith(html);
}
});
}
}
Very important thing to factor in, is if I do a hard refresh on the
page, here are the results... a missing OB/GYN note, which is the way
it should be:
http://catalyst.httpd.org/tmp/6.png
Any idea folks? Would really appreciate any help. Firebug also shows
that in its response to my POST call that the notes are not there in
its table rendering. My server-side code looks like this:
if($_POST['delete']) {
global $db_alpha, $link;
$alpha_note_set = array();
$db = mysql_select_db($db_alpha, $link);
if(!$db) {
die(Can't connect to alpha, please contact steve.);
}
$sql = DELETE from ms_notes
WHERE ID='.$_POST['delete']
.' LIMIT 1;
$result='';
$result = mysql_query($sql);
if(!$result) { die(Something is broken... ); }
$sql = SELECT NAME,ID from ms_notes;
$alpha_result_set = @mysql_query($sql);
$row='';
if(mysql_num_rows($alpha_result_set)==0) { $html = There are zero
notes left to process in Alpha's database; echo $html; exit; }
while($row = @mysql_fetch_array($alpha_result_set, MYSQL_ASSOC)) {
$alpha_note_set[] = $row; }
$html='';
$html = 'table';
$html .= 'tr';
// count here basically just keeps track of a
// neatly aligned table
$count=0;
foreach($alpha_note_set as $note) {
$html .= tda href=\javascript:void(0);\
onclick=\removeNote('.$note[ID].','.$note[NAME].')\delete/anbsp;nbsp;$note[NAME]/td;
$count++;
if(($count % 2 == 0)) {
$html .= /trtr;
}
}
$html .= '/tr/table';
// send this sucker back to the view.
echo $html;
}
Thanks all.
- sf
[jQuery] Re: .replaceWith() broken in Firefox 2 I think
John,
Well figures .. it is my code. .html() certainly does the trick. I
wasn't aware that replaceWith removes stuff from the DOM indefinitely.
A, thanks for saving me from hours of troubleshooting. I really
really appreciate it.
- sf
On 9/24/07, John Resig [EMAIL PROTECTED] wrote:
Are you meaning to do .html(..) instead of replaceWith? replaceWith
completely removes the element (which means that when it's called the
second time, nothing happens, since the element no longer exists).
Whereas .html() simply replaces the contents of the element.
--John
On 9/24/07, Steve Finkelstein [EMAIL PROTECTED] wrote:
This is actually happening in IE7 also. Is it possible that something
is hosed with my code? I'm more confident it's that than a broken
replaceWith() but I'd really like to know why it only works once, and
then I need a page refresh for that ajax effect.
- sf
On 9/24/07, Steve Finkelstein [EMAIL PROTECTED] wrote:
Hi all,
So I have a simple script which essentially uses .replaceWith() to
replace the containing elements HTML with a success callback. This
works fine the first time I invoke a function which calls
.replaceWith() in the success call back, but any subsequent calls
leaves the DOM unmodified.
Here's an example screenshot of what my page looks like upon a random
page load.
http://catalyst.httpd.org/tmp/1.png
Ok so I have 4 notes. Let's delete one:
http://catalyst.httpd.org/tmp/2.png
Perfect, it's gone:
http://catalyst.httpd.org/tmp/3.png
Here's where the problem occurs... Let's delete another
http://catalyst.httpd.org/tmp/4.png
Hmmm, it didn't disappear from the DOM this time:
http://catalyst.httpd.org/tmp/5.png
The OB/GYN note is still there as rendered by the browser, however the
server-side script surely wiped it:
mysql select id,name from ms_notes where id=CN;
Empty set (0.00 sec)
Here's what my code looks like to remove the note:
function removeNote(id,name) {
if(confirm(Are you sure you wish to delete: +name+?)) {
// ajax code here to remove note.
$.ajax({
url: /dbserver.php,
type: POST,
data: delete=+id,
cache: false,
success: function(html) {
$(#alpha_notes).empty();
$(#alpha_notes).replaceWith(html);
}
});
}
}
Very important thing to factor in, is if I do a hard refresh on the
page, here are the results... a missing OB/GYN note, which is the way
it should be:
http://catalyst.httpd.org/tmp/6.png
Any idea folks? Would really appreciate any help. Firebug also shows
that in its response to my POST call that the notes are not there in
its table rendering. My server-side code looks like this:
if($_POST['delete']) {
global $db_alpha, $link;
$alpha_note_set = array();
$db = mysql_select_db($db_alpha, $link);
if(!$db) {
die(Can't connect to alpha, please contact steve.);
}
$sql = DELETE from ms_notes
WHERE ID='.$_POST['delete']
.' LIMIT 1;
$result='';
$result = mysql_query($sql);
if(!$result) { die(Something is broken... ); }
$sql = SELECT NAME,ID from ms_notes;
$alpha_result_set = @mysql_query($sql);
$row='';
if(mysql_num_rows($alpha_result_set)==0) { $html = There are zero
notes left to process in Alpha's database; echo $html; exit; }
while($row = @mysql_fetch_array($alpha_result_set, MYSQL_ASSOC)) {
$alpha_note_set[] = $row; }
$html='';
$html = 'table';
$html .= 'tr';
// count here basically just keeps track of a
// neatly aligned table
$count=0;
foreach($alpha_note_set as $note) {
$html .= tda href=\javascript:void(0);\
onclick=\removeNote('.$note[ID].','.$note[NAME].')\delete/anbsp;nbsp;$note[NAME]/td;
$count++;
if(($count % 2 == 0)) {
$html .= /trtr;
}
}
$html .= '/tr/table';
// send this sucker back to the view.
echo $html;
}
Thanks all.
- sf
[jQuery] Feedback for a proposal to switch from prototype to jQuery
Hi all, So we all obviously know why jQuery is better than prototype, otherwise we wouldn't be here. I use jQuery for all of my personal projects, but unfortunately I'm stuck with prototype in my day job. We do have a rather complex piece of software, and I'd have to go through a lot of code in order to see how long it would take to switch to jQuery, but I'm sure it's feasible. What I'm hoping for, is some feedback from you folks on the best way to start a proposal for why we should switch to jQuery. I have a huge dotted list, including some obvious facts such as having the best community, excellent documentation, ease of use, widgets/plugins all available from a central repository for the most part, it goes on and on. If anyone of you have done something similar and were successful, I'd love to hear from you. My CTO is a very reasonable guy, but he's also very technical and he'll be ready to counter any potential reasons to decline using jQuery, and I have a feeling his most valid point would be the difficulty and time it would take to switch. He'll also probably mention that new javascript frameworks are emerging everyday and if we keep switching we'll never finish the application. Those are very strong arguments and will be hard to reasonably respond to. Anyhow, I want to take a stab at it. I want to be able to sit at my desk and continue using jQuery at the office and not only on my own projects. Thanks for any ideas all. :-) - sf
[jQuery] Re: Can anyone suggest a jQuery way of improving this UI? Screenshot included.
Thanks for the suggestions all. I appreciate every one of your responses and am taking them all into consideration. I was wondering if someone also give me a more concrete suggestion such as a plugin to use? I'm looking at the following and think it can be of great use: http://docs.jquery.com/UI/Sortables Thanks all. Please don't mind any non-coherent speak above. I've been up for over 24 hours straight scripting away. Cheers! - sf On 9/15/07, Steve Finkelstein [EMAIL PROTECTED] wrote: Hi all, So I created a portion of a project which users are having quite a bit of difficulty working with. If you take a look at the following screen shot, it'll give you the general gist of the particular page: http://catalyst.httpd.org/tmp/photos.png Here, users can order their pictures by inputting a priority number in a text input as you can see. When they're done with their modifications, an AJAX call is made to the server to update the database with the respective info via the 'Update Photos' button below. I was curious if there is any widgets available that will allow me to make this following page easier to use. I'm more than happy to rewrite this entire part of the project. I'm using jQuery in probably 99% of my project already. Maybe drag and drop would be good here, maybe overkill? I would definitely appreciate any advice. Thank you kindly for any insight folks. - sf
[jQuery] Re: Dynamic loading of PHP array into jCarousel?
Hi thanks for the reply Ted. :-)
I got around to figuring this out last night. I built my JavaScript
array using server-side data. Still has some work but I got an
example page up that's working:
http://devel.phpgeek.org/inventory/single/10
- sf
On 9/16/07, Theodore Ni [EMAIL PROTECTED] wrote:
That example is dynamic in the sense that you can populate that Javascript
array in many different ways. For example, you could take in user input and
create an array, or you can let your PHP echo out a Javascript array.
For dynamic in the sense that we use AJAX to pull data and then create the
carousel, a simple example would be
http://sorgalla.com/projects/jcarousel/examples/dynamic_javascript.html
Notice in each of the examples you still need to write your own function to
parse whatever data/string you return from the server. The example in the
link I gave you used jQuery.get() to pull a simple page
http://sorgalla.com/projects/jcarousel/examples/dynamic_ajax.txt
which just has some image URLs separated by a | character. The functions in
the page then separate the individual URLs and add them into the carousel.
You only need something like this on your server side after you get your
item array $photos from the database (in fact, you could do this in your
while loop if you are using one to pull data):
$photo_src = array();
for ($i = 0, $l = count($photos); $i $l; $i++) {
$photo_src[] = $photos['photo_id'] . '.jpg';
}
$photo_string = implode('|', $photo_src);
echo $photo_string;
Then, just replace dynamic_ajax.txt in the sample code with
your_php_page.php
On 9/15/07, Steve Finkelstein [EMAIL PROTECTED] wrote:
Hi all,
I'm a bit confused trying to understand sources on dynamic loading of
images into a jCarousel object. The issue here is the JavaScript
array is already populated by page load, and obviously I can't see how
server-side data was used to populate it. I'm a bit novice when it
comes to this, but could certainly use some help. An example
JavaScript array taken from the example sites include:
var mycarousel_itemList = [
{url:
http://static.flickr.com/66/199481236_dc98b5abb3_s.jpg;,
title: Flower1},
{url:
http://static.flickr.com/75/199481072_b4a0d09597_s.jpg;,
title: Flower2},
{url:
http://static.flickr.com/57/199481087_33ae73a8de_s.jpg ,
title: Flower3},
{url:
http://static.flickr.com/77/199481108_4359e6b971_s.jpg;,
title: Flower4},
{url:
http://static.flickr.com/58/199481143_3c148d9dd3_s.jpg;,
title: Flower5},
{url:
http://static.flickr.com/72/199481203_ad4cdcf109_s.jpg;,
title: Flower6},
{url:
http://static.flickr.com/58/199481218_264ce20da0_s.jpg ,
title: Flower7},
{url:
http://static.flickr.com/69/199481255_fdfe885f87_s.jpg;,
title: Flower8},
{url:
http://static.flickr.com/60/199480111_87d4cb3e38_s.jpg;,
title: Flower9},
{url:
http://static.flickr.com/70/229228324_08223b70fa_s.jpg;,
title: Flower10}
];
Maybe I'm confused with the sense of 'dynamic' here, but I need to
load all images that I populate from a table in my database. A dump of
this array might look like this:
[0] = Array
(
[photo_id] = 2
[vehicle_id] = 1
[caption] =
[position] = 2
[cars_com] = 0
[autotrader_com] = 0
)
[1] = Array
(
[photo_id] = 4
[vehicle_id] = 1
[caption] =
[position] = 4
[cars_com] = 0
[autotrader_com] = 0
)
At which point 2.jpg and 4.jpg are the photos I need to load.
Thank you for any insight into how I can solve this problem.
- sf
--
Ted
[jQuery] Re: NEWS: jQuery 1.2 Released
Dang, now we need Karl and team to write a new learning jQuery book! Thanks so much John and team! (and yes I'm quite late in response, but with so many threads in this list, I didn't even notice 1.2 was released until today) Cya all on #jQuery :-) - sf/zuez On 9/11/07, John Resig [EMAIL PROTECTED] wrote: Hi Everyone - jQuery 1.2 has been released! More information (and a jQuery UI sneak peek!): http://jquery.com/blog/2007/09/10/jquery-12-jqueryextendawesome/ Full release notes and download information: http://docs.jquery.com/Release:jQuery_1.2 Enjoy! --John
[jQuery] jCarousel with thickbox inquiry re: scrolling photos
Hi folks, This is probably something I'll end up needing to address on the respective thickbox forums. I was hoping to give my luck a go at the forum here though as the community is always willing to help. Anyway, I have a development page I'm working on which is publically accessible via here: http://devel.phpgeek.org/inventory/single/10 As you can see, the heart and soul of this profile is the lovely jcarousel plugin with thickbox functionality. What I'd like to do to further enhance UI and avoid more mouse clicks than necessary. I'd like to allow users to surf through the photos after they pop-up the initial photo, but I'm not sure how to implement it. There is an example of this in: http://jquery.com/demo/thickbox/ Would anyone be kind enough to point me in the correct direction? Thanks so much all, enjoy the rest of your weekend. - sf
[jQuery] Re: jCarousel with thickbox inquiry re: scrolling photos
Sorry to reply to my own thread, but I figured it out for the most part. Had to make use of the rel attribute within my anchor, simple enough. The only limitation to this is, if you don't scroll through the carousel, thickbox will only create navigation for the first three images. I have to close the inline pop up, go through more pics in the carousel, then reload thickbox to be able to navigate the rest of the images. You can experiment this at: http://devel.phpgeek.org/inventory/single/10 Is there a fix? On 9/16/07, Steve Finkelstein [EMAIL PROTECTED] wrote: Hi folks, This is probably something I'll end up needing to address on the respective thickbox forums. I was hoping to give my luck a go at the forum here though as the community is always willing to help. Anyway, I have a development page I'm working on which is publically accessible via here: http://devel.phpgeek.org/inventory/single/10 As you can see, the heart and soul of this profile is the lovely jcarousel plugin with thickbox functionality. What I'd like to do to further enhance UI and avoid more mouse clicks than necessary. I'd like to allow users to surf through the photos after they pop-up the initial photo, but I'm not sure how to implement it. There is an example of this in: http://jquery.com/demo/thickbox/ Would anyone be kind enough to point me in the correct direction? Thanks so much all, enjoy the rest of your weekend. - sf
[jQuery] Re: Dynamic loading of PHP array into jCarousel?
Hi Theodore,
I do have thumbnails loaded I thought? Hmmm, I was dealing with
another issue. If you click on a carousel image before scorlling
through it, thickbox will only allow you to navigate through the first
three photos in the gallery. You need to go through the entire
scrolling of the carousel to have them all propagate and I can't catch
where this is occuring.
Thanks again.
On 9/16/07, Theodore Ni [EMAIL PROTECTED] wrote:
It looks pretty good. You may think about using thumbnail images for the
carousel, but you may have thought of that already.
On 9/16/07, Steve Finkelstein [EMAIL PROTECTED] wrote:
Hi thanks for the reply Ted. :-)
I got around to figuring this out last night. I built my JavaScript
array using server-side data. Still has some work but I got an
example page up that's working:
http://devel.phpgeek.org/inventory/single/10
- sf
On 9/16/07, Theodore Ni [EMAIL PROTECTED] wrote:
That example is dynamic in the sense that you can populate that
Javascript
array in many different ways. For example, you could take in user input
and
create an array, or you can let your PHP echo out a Javascript array.
For dynamic in the sense that we use AJAX to pull data and then create
the
carousel, a simple example would be
http://sorgalla.com/projects/jcarousel/examples/dynamic_javascript.html
Notice in each of the examples you still need to write your own function
to
parse whatever data/string you return from the server. The example in
the
link I gave you used jQuery.get() to pull a simple page
http://sorgalla.com/projects/jcarousel/examples/dynamic_ajax.txt
which just has some image URLs separated by a | character. The functions
in
the page then separate the individual URLs and add them into the
carousel.
You only need something like this on your server side after you get your
item array $photos from the database (in fact, you could do this in your
while loop if you are using one to pull data):
$photo_src = array();
for ($i = 0, $l = count($photos); $i $l; $i++) {
$photo_src[] = $photos['photo_id'] . '.jpg';
}
$photo_string = implode('|', $photo_src);
echo $photo_string;
Then, just replace dynamic_ajax.txt in the sample code with
your_php_page.php
On 9/15/07, Steve Finkelstein [EMAIL PROTECTED] wrote:
Hi all,
I'm a bit confused trying to understand sources on dynamic loading of
images into a jCarousel object. The issue here is the JavaScript
array is already populated by page load, and obviously I can't see how
server-side data was used to populate it. I'm a bit novice when it
comes to this, but could certainly use some help. An example
JavaScript array taken from the example sites include:
var mycarousel_itemList = [
{url:
http://static.flickr.com/66/199481236_dc98b5abb3_s.jpg;,
title: Flower1},
{url:
http://static.flickr.com/75/199481072_b4a0d09597_s.jpg
,
title: Flower2},
{url:
http://static.flickr.com/57/199481087_33ae73a8de_s.jpg
,
title: Flower3},
{url:
http://static.flickr.com/77/199481108_4359e6b971_s.jpg;,
title: Flower4},
{url:
http://static.flickr.com/58/199481143_3c148d9dd3_s.jpg;,
title: Flower5},
{url:
http://static.flickr.com/72/199481203_ad4cdcf109_s.jpg;,
title: Flower6},
{url:
http://static.flickr.com/58/199481218_264ce20da0_s.jpg ,
title: Flower7},
{url:
http://static.flickr.com/69/199481255_fdfe885f87_s.jpg
,
title: Flower8},
{url:
http://static.flickr.com/60/199480111_87d4cb3e38_s.jpg;,
title: Flower9},
{url:
http://static.flickr.com/70/229228324_08223b70fa_s.jpg;,
title: Flower10}
];
Maybe I'm confused with the sense of 'dynamic' here, but I need to
load all images that I populate from a table in my database. A dump of
this array might look like this:
[0] = Array
(
[photo_id] = 2
[vehicle_id] = 1
[caption] =
[position] = 2
[cars_com] = 0
[autotrader_com] = 0
)
[1] = Array
(
[photo_id] = 4
[vehicle_id] = 1
[caption] =
[position] = 4
[cars_com] = 0
[autotrader_com] = 0
)
At which point 2.jpg and 4.jpg are the photos I need to load.
Thank you for any insight into how I can solve this problem.
- sf
--
Ted
--
Ted
[jQuery] Can anyone suggest a jQuery way of improving this UI? Screenshot included.
Hi all, So I created a portion of a project which users are having quite a bit of difficulty working with. If you take a look at the following screen shot, it'll give you the general gist of the particular page: http://catalyst.httpd.org/tmp/photos.png Here, users can order their pictures by inputting a priority number in a text input as you can see. When they're done with their modifications, an AJAX call is made to the server to update the database with the respective info via the 'Update Photos' button below. I was curious if there is any widgets available that will allow me to make this following page easier to use. I'm more than happy to rewrite this entire part of the project. I'm using jQuery in probably 99% of my project already. Maybe drag and drop would be good here, maybe overkill? I would definitely appreciate any advice. Thank you kindly for any insight folks. - sf
[jQuery] Dynamic loading of PHP array into jCarousel?
Hi all,
I'm a bit confused trying to understand sources on dynamic loading of
images into a jCarousel object. The issue here is the JavaScript
array is already populated by page load, and obviously I can't see how
server-side data was used to populate it. I'm a bit novice when it
comes to this, but could certainly use some help. An example
JavaScript array taken from the example sites include:
var mycarousel_itemList = [
{url: http://static.flickr.com/66/199481236_dc98b5abb3_s.jpg;,
title: Flower1},
{url: http://static.flickr.com/75/199481072_b4a0d09597_s.jpg;,
title: Flower2},
{url: http://static.flickr.com/57/199481087_33ae73a8de_s.jpg;,
title: Flower3},
{url: http://static.flickr.com/77/199481108_4359e6b971_s.jpg;,
title: Flower4},
{url: http://static.flickr.com/58/199481143_3c148d9dd3_s.jpg;,
title: Flower5},
{url: http://static.flickr.com/72/199481203_ad4cdcf109_s.jpg;,
title: Flower6},
{url: http://static.flickr.com/58/199481218_264ce20da0_s.jpg;,
title: Flower7},
{url: http://static.flickr.com/69/199481255_fdfe885f87_s.jpg;,
title: Flower8},
{url: http://static.flickr.com/60/199480111_87d4cb3e38_s.jpg;,
title: Flower9},
{url: http://static.flickr.com/70/229228324_08223b70fa_s.jpg;,
title: Flower10}
];
Maybe I'm confused with the sense of 'dynamic' here, but I need to
load all images that I populate from a table in my database. A dump of
this array might look like this:
[0] = Array
(
[photo_id] = 2
[vehicle_id] = 1
[caption] =
[position] = 2
[cars_com] = 0
[autotrader_com] = 0
)
[1] = Array
(
[photo_id] = 4
[vehicle_id] = 1
[caption] =
[position] = 4
[cars_com] = 0
[autotrader_com] = 0
)
At which point 2.jpg and 4.jpg are the photos I need to load.
Thank you for any insight into how I can solve this problem.
- sf
[jQuery] What can add an effect to this rotate?
Hi all, I was curious, is there anything jQuery has available that can take this single image rotater and add an effect to it? Something that slowly fades in the next photo? An example of what I'm trying to apply this on is http://devel.phpgeek.org. If someone can point out what I can reference or read in documentation for this, that'd be great. Thanks! - sf
[jQuery] Re: What can add an effect to this rotate?
Mike you're just filled with tricks up your sleeve, aren't you? Thank you so much, I bookmarked that. Seems I have a few of your personals bookmarked already! - sf On 8/31/07, Mike Alsup [EMAIL PROTECTED] wrote: I was curious, is there anything jQuery has available that can take this single image rotater and add an effect to it? Something that slowly fades in the next photo? An example of what I'm trying to apply this on is http://devel.phpgeek.org. The Cycle Plugin can do that, as can InnerFade and others. http://malsup.com/jquery/cycle/
[jQuery] moreSelectors plugin syntax issue?
Hi all,
I'm using the jQuery Form plugin by Mike Alsup and jQuery More Selectors
here: http://www.softwareunity.com/sandbox/JQueryMoreSelectors/
I have a callback function which I'm calling with the following syntax:
function validate() {
// ensure something is at least filled out.
if ($('#form2:modified'))
{
$('#error').show(slow, function(){
setTimeout($('#error').hide('slow'), 1);
});
// Do not submit the call to server.
return false;
}
}
This seems to error out, and I can't find where the syntax issue is.
Thanks for any help.
- sf
[jQuery] Re: Form plugin and error validation
Hi mike,
First and foremost, thanks for your reply!
As for the validation, should I return a string such as 'errors' and
eval() it in my success callback? I'm not entirely sure how to let js
know that the server deemed something in the form as a booboo.
Thanks again.
- sf
Sent from my iPhone
On Aug 30, 2007, at 8:04 AM, Mike Alsup [EMAIL PROTECTED] wrote:
Steve,
If you need that kind of control over the reset then I suggest you use
the resetForm function rather than the resetForm option property. In
your success handler, once you've determined there is no logical error
you, can simply invoke:
$('#myForm').resetForm();
Mike
On 8/29/07, Steve Finkelstein [EMAIL PROTECTED] wrote:
Hi all,
Is there a way I can stop resetForm: true from hitting when I deem
something is invalid via server-side validation? For example, here's
my ajaxForm object:
$('#form2').ajaxForm(
{
target: '#container',
type: 'post',
resetForm: true,
}
);
And on the server-side I have a very rudimentary validation:
if($error_message)
{
echo $error_message;
exit;
}
Is there anyway to tell ajaxForm when there is a logical error so
that
success: and resetForm: are not executed. I understand those
parameters are there for successful AJAX responses, not logical
errors. I'm just not sure how to stop the form from resetting when I
have logical errors, however I do want this functionality to exist
for
the form is indeed error free.
Thank you,
- sf
[jQuery] jQuery and dynamic image album, possible?
Well, I'm sure it's possible, but I'm a newb and could use veteran advice. :-) I have a form which dynamically finds photos upon each GET of the page. So the photos in one page refresh might be different from another depending on actions the user has taken. Here's a sample: http://stevefink.net/photosamp.png (yes I know its pictures of jewelry with cars.com/autotrader.com checkboxes, I don't have as many vehicle photos as jewelry photos in my archives. :P ) Anyhow, is there any util I can use to display these dynamically loaded images predefined in a serverside array in a neat jquery album/ plugin of some sort? I'd rather do that than embed the img in anchor tags with the original size photo (these are thumb nails). Inline loading of images would be ideal, nothing too fancy! Thank you all, so much! - sf
[jQuery] jQuery form, invalid success label?
Hi,
Firebug is reporting success: is an invalid label with the following code:
$(document).ready(function() {
// bind 'form2' and provide a simple callback function
$('#form2').ajaxForm(function() {
// Server should send data back in json encoding
dataType:'json',
success:function() {
alert(DEBUG: Testing.);
}
});
});
Any idea?
-sf
[jQuery] DOM problems with jQuery's Form Plugin
Hi,
The following code works:
$(document).ready(function() {
// bind 'form2' and provide a simple callback function
$('#form2').ajaxForm(function() {
alert(DEBUG Test);
});
});
However the following does not:
$(document).ready(function() {
// bind 'form2' and provide a simple callback function
$('#form2').ajaxForm(function() {
// Server should send data back in json encoding
target: '#container'
});
});
No broken responses. My div id=container/div just does not get
updated. My server sends back:
echo DEBUG MESSAGE;
Firebug shows the echo'd response.
Totally would appreciate any help.
- sf
[jQuery] Re: DOM problems with jQuery's Form Plugin
Actually AgentScorpion helped me out on IRC .. here was the issue:
$('#form2').ajaxForm({ target: '#container', type: 'post' });
I was trying to send ajaxForm a function with parameters ... all is well
now, thanks. :-)
On 8/29/07, Josh Nathanson [EMAIL PROTECTED] wrote:
Hi Steve,
Make sure your JSON is well formed. If it is not, your callback probably
won't work. Try doing just a console.log with the returned json data
and
see what you get, then try to eval it to see if will return an object.
-- Josh
- Original Message -
From: Steve Finkelstein [EMAIL PROTECTED]
To: jQuery (English) jquery-en@googlegroups.com
Sent: Wednesday, August 29, 2007 2:47 PM
Subject: [jQuery] DOM problems with jQuery's Form Plugin
Hi,
The following code works:
$(document).ready(function() {
// bind 'form2' and provide a simple callback function
$('#form2').ajaxForm(function() {
alert(DEBUG Test);
});
});
However the following does not:
$(document).ready(function() {
// bind 'form2' and provide a simple callback function
$('#form2').ajaxForm(function() {
// Server should send data back in json encoding
target: '#container'
});
});
No broken responses. My div id=container/div just does not get
updated. My server sends back:
echo DEBUG MESSAGE;
Firebug shows the echo'd response.
Totally would appreciate any help.
- sf
[jQuery] JQuery .load() issue, (user error)
Yes, I know this is my fault. Where though, I'm clueless. If someone
can help me recover from my fumble, I'd appreciate it.
I have a div that resembles the following:
div id=showPhotos
script type=text/javascript
$('#showPhotos').load('get_photos', {vehicle_id: ?=$this-uri-
segment(4);?});
/script
/div
I'm sending vehicle_id to a serverside PHP script. I then return an
Object into a separate HTML template which should get injected into
that div that takes the Object and echos out some parameters. When I
use firebug to debug this, Response says: Loading ...
If I need to post more information to help debug this, I'd love to
provide it. I'm sort of stuck thinking of alternative ways to approach
this.
Thanks for the assistance. :-)
- sf
[jQuery] Re: JQuery .load() issue, (user error)
Hi Michael,
Thanks for the reply.
Don't think that did the trick unfortunately. I moved the code out into
head/head with the following:
script type=text/javascript
$(function() {
$('#showPhotos').show(slow, function() {
$.ajax({
data: vehicle_id=+?= $this-uri-segment(4); ?,
timeout: 1,
type: 'POST',
url: get_photos,
error:function() { alert(showPhotos was NOT
successfully loaded.. Contact the system administrator.); },
success: function() { alert(showPhotos was
successfully loaded.); },
}); // end $.ajax
}); // end show()
});
/script
get_photos returns an array to an HTML template.
Not sure exactly what the issue is still unfortunately.
On 8/27/07, Steve Finkelstein [EMAIL PROTECTED] wrote:
Yes, I know this is my fault. Where though, I'm clueless. If someone
can help me recover from my fumble, I'd appreciate it.
I have a div that resembles the following:
div id=showPhotos
script type=text/javascript
$('#showPhotos').load('get_photos', {vehicle_id:
?=$this-uri-
segment(4);?});
/script
/div
I'm sending vehicle_id to a serverside PHP script. I then return an
Object into a separate HTML template which should get injected into
that div that takes the Object and echos out some parameters. When I
use firebug to debug this, Response says: Loading ...
If I need to post more information to help debug this, I'd love to
provide it. I'm sort of stuck thinking of alternative ways to approach
this.
Thanks for the assistance. :-)
- sf
[jQuery] Adding a 'reset' feature to form
Hi all, I currently have your rudimentary HTML form. ( it's large and complex by nature, but lacks any fancy JS plugins etc. ) I was curious if there is a way to integrate a 'Reset All' button to clear all the values to their original values if possible, using some JQuery plugin? Something quick and hackish would work. Thanks all.
[jQuery] Help with re-populating a server-side select box using JQuery
Hi all,
I have some very rudimentary HTML markup w/ serverside PHP that
populates a select box like this:
select name=make id=make onchange=if ((this.value) ==
'add_make') { $('#addMakeOption').show(); } else { $
('#addMakeOption').hide(); }
option clas=staticOpt**/option
option value=add_make class=staticOptAdd Make/option
?php foreach($makes-result() as $make): ?
option value=?= strtolower($make-name) ? ?=
$make-name; ?
/option
?php endforeach; ?
/select br
As you can see, I've added some jquery to pop up a div to let me add
more makes into the select box. I got that part working great with the
following code:
$('#add_make').click(function () {
//alert(Model value : + $('#add_make_text').val());
$.ajax({
data: make_val=+$('#add_make_text').val(),
timeout: 1,
type: 'POST',
url: /addvehicle/add_make,
error:function() { alert(Make was not
successfully
added. Contact the system administrator.); },
success: function() {
$('#addMakeOption').hide();
} // end success callback
}); // end $.ajax
}); // end add_make.click and stuff.
My only issue at this point is if I'm already using AJAX to populate a
select box, does anyone see a possible alternative here for me to re-
populate the select box in the success callback function? As this
point the only way I see doing that is with a full page refresh
otherwise.
Thanks for any advice.
- sf
[jQuery] Selecting an option?
I'm trying to select an option in a successful callback function using
the following syntax:
$('select#make option').('#null').attr({ selected: selected });
Does anyone here see what's wrong?
Thanks.
[jQuery] Re: Selecting an option?
Hiya Karl!
Thanks for the reply. Just for those who might be searching the archives in
the future, I figure I'd also give some useful insight. I haven't tried
Karl's method, but I did run into
http://www.texotela.co.uk/code/jquery/select/.
I have some variables set after the DOM is loaded:
var currentMakeSel = $(#make).val();
var currentModelSel= $(#model).val();
var currentTrimSel = $(#trim).val();
Then I just roll:
$(select#make).selectOptions(currentMakeSel);
$(select#model).selectOptions(currentModelSel);
$(select#trim).selectOptions(currentTrimSel);
Thanks again and I hope this helps someone!
- sf
On 8/24/07, Karl Swedberg [EMAIL PROTECTED] wrote:
On Aug 23, 2007, at 11:11 PM, Steve Finkelstein wrote:
I'm trying to select an option in a successful callback function using
the following syntax:
$('select#make option').('#null').attr({ selected: selected });
Does anyone here see what's wrong?
Yes, this part:
.('#null')
Is that supposed to be the id of one of the options? if so, you could
write it like this:
$('#null').attr({ selected: selected });
Since IDs are unique, no need to give it context.
--Karl
_
Karl Swedberg
www.englishrules.com
www.learningjquery.com
[jQuery] Checkbox updating database asynchronously?
Hi all, I'm looking for a simple way to change a boolean value in a database based on whether a checkbox is checked or not in a jquery environment. Would anyone be kind enough to point me in the correct direction to get this accomplished? Thank you. - sf
[jQuery] Plugin for uploading multiple files/directories?
Hi all, I'm looking to allow a user to upload mutliple files or even better, an entire directory worth of files. Adding a progress bar for the batch or single file upload would be ideal. What's my best bet for doing this? Thanks. - sf
[jQuery] File upload plugin available?
Hi all, I'm looking for an elegant and visual appealing file upload plugin. I don't need any stunning effects, just something appealing to the eye, and can allow a user to upload an image or directory on their local system. Can anyone recommend such a utility with jquery? Thank you all! - sf
[jQuery] How do I bind this into the DOM?
Hi all,
This is a rather complicated issue, for a novice at least.
I have HTML that gets injected into the DOM, and this is after a completely
separate HTML gets injected via .load() into a separate div.
So essentially, when you load the page, a div gets populated with .load(),
and when you click a link from that populated data, more HTML gets injected
via the following code:
$('#pendingUsers').load('index.php/meduser/check_pending_users',false,
function() {
$('#pendingUsers a').click(function() {
$.post('index.php/meduser/pull_user_information', {id:
$(this).attr('rel')},
function(data) {
$('#main').html(data);
}
);
});
});
I'm looking to bind .click() to an element within $('#main').html(data);,
over to input type=button id=button name=accept value=Accept
Would anyone be kind enough to give me hints as to how I can access my
button via a click action in this setup?
Thank you kindly for all of your assistance!
[jQuery] Event bubbling
Hi all,
Using this block of code:
--
$(document).ready(function() {
$('body').click(function(event) {
if ($(event.target).is('h3')) {
$(event.target).toggleClass('highlighted');
}
});
});
--
If my element I'm trying to toggle is input type=button id=button-
accept name=accept value=Accept onclick=return false;, is
there anyway I can do something similar to if($
(event.target).is('#button-accept'));
If not, what does $(event.target) have to point to in .is() to trigger
my input in this situation?
[jQuery] $.post() and CI inquiry
Hi all,
I have a simple javascript file being loaded externally that has the
following code:
-- snip --
$(document).ready(function() {
$('#pendingUsers').load('index.php/meduser/check_pending_users',false,
function() {
$('#pendingUsers a').click(function() {
$.post('index.php/meduser/pull_user_information', {id: $(this).attr('rel')}
);
});
});
setInterval(function() {
$('#pendingUsers').load('index.php/meduser/check_pending_users');
}, 30);
// initially hide the main content div until a pending user is clicked.
});
-- snip --
My issue here is I'm not sure how with CI to associate the $.post() with the
div I want to populate the data back from the server with in a view. My view
contains a div id=main/div area where the results should be posted
back.
My controller looks like this:
function pull_user_information()
{
$id = $this-input-post('id');
$data['query'] = $this-db_users-query('select * from tbl_signups
where ID=$id'
);
$this-load-view('default/meduser_useraccordny_view', $data);
}
I'm trying to populate the rel of the anchor tag into $id and using that to
query the database.
I can then pass that into the meduser_useraccordny_view, however I'm still
not entirely sure how to populate the particular div.
Any assistance would be appreciated!
[jQuery] Re: JQuery populating div with AJAX
Benjamin,
Thank you kindly again.
One last inquiry. Do I pop that into a separate script? Possible just throw
it inside of a $(document).ready() wrapper?
On 8/10/07, Benjamin Sterling [EMAIL PROTECTED] wrote:
Not entirely sure what you are saying but you can do something like:
setInterval(function(){
$.ajax({
type: POST,
url: some.php
,
success: function(msg){
$('myDiv).text(msg);
}
});
}, 1000);
On 8/10/07, Steve Finkelstein [EMAIL PROTECTED] wrote:
Benjamin,
I believe you understood properly, yes!
I'm not sending the server any information, just receiving back
information from a database which is influenced from other sources, not this
application. I'll have to lookup SetInterval syntax, thanks for the
pointer. Is it wise to try the excerpt you put below in a separate script
to keep my XHTML clean and call it within the div somehow?
Thanks again for your help.
On 8/10/07, Benjamin Sterling [EMAIL PROTECTED] wrote:
Steve,
You ultimately don't need to send params to the server side page, you
will just need to account for the returned information.
$.ajax({
type: POST,
url: some.php,
success: function(msg){
alert( Data Saved: + msg );
}
});
the success is where you would put your function to handle your return
information.
Now, if this is something you want to do every X amount of minutes or
seconds, just put that in a setInterval function.
Let me know if I understood you correctly.
On 8/10/07, Steve Finkelstein [EMAIL PROTECTED] wrote:
Hi all
I'm looking to populate a div with information from a database ...
don't want to pass any parameters to the serverside script, just
want
the div updated according to my query if the db record sets are
modified, is .ajaxStart() the appropriate function for this?
I'm basically looking to have the jquery poll the server every X
seconds. Since HTTP is a connectionless protocol, I'm not entirely
sure what the proper way would be to stop/start the request using
good
practices.
In pseudo-type code it should work like this:
User visits site.
a request is made from the client to the server to invoke a
function.
a function on the server-side queries my mysql database with a
simple
query.
the result set is returned as an array to the javascript object.
the javascript object gets injected into the DOM.
No parameters are passed in the ajax request to the server.
thanks again for any insight folks.
--
Benjamin Sterling
http://www.KenzoMedia.com
http://www.KenzoHosting.com
--
Benjamin Sterling
http://www.KenzoMedia.com
http://www.KenzoHosting.com
[jQuery] Re: JQuery populating div with AJAX
Benjamin,
I believe you understood properly, yes!
I'm not sending the server any information, just receiving back information
from a database which is influenced from other sources, not this
application. I'll have to lookup SetInterval syntax, thanks for the
pointer. Is it wise to try the excerpt you put below in a separate script
to keep my XHTML clean and call it within the div somehow?
Thanks again for your help.
On 8/10/07, Benjamin Sterling [EMAIL PROTECTED] wrote:
Steve,
You ultimately don't need to send params to the server side page, you will
just need to account for the returned information.
$.ajax({
type: POST,
url: some.php,
success: function(msg){
alert( Data Saved: + msg );
}
});
the success is where you would put your function to handle your return
information.
Now, if this is something you want to do every X amount of minutes or
seconds, just put that in a setInterval function.
Let me know if I understood you correctly.
On 8/10/07, Steve Finkelstein [EMAIL PROTECTED] wrote:
Hi all
I'm looking to populate a div with information from a database ...
don't want to pass any parameters to the serverside script, just want
the div updated according to my query if the db record sets are
modified, is .ajaxStart() the appropriate function for this?
I'm basically looking to have the jquery poll the server every X
seconds. Since HTTP is a connectionless protocol, I'm not entirely
sure what the proper way would be to stop/start the request using good
practices.
In pseudo-type code it should work like this:
User visits site.
a request is made from the client to the server to invoke a function.
a function on the server-side queries my mysql database with a simple
query.
the result set is returned as an array to the javascript object.
the javascript object gets injected into the DOM.
No parameters are passed in the ajax request to the server.
thanks again for any insight folks.
--
Benjamin Sterling
http://www.KenzoMedia.com
http://www.KenzoHosting.com
[jQuery] populate div with ajax inquiry
Hi all I'm looking to populate a div with information from a database ... don't want to pass any parameters to the serverside script, just want the div updated according to my query if the db record sets are modified, is .ajaxStart() the appropriate function for this? I'm basically looking to have the jquery poll the server every X seconds. Since HTTP is a connectionless protocol, I'm not entirely sure what the proper way would be to stop/start the request using good practices. In pseudo-type code it should work like this: User visits site. a request is made from the client to the server to invoke a function. a function on the server-side queries my mysql database with a simple query. the result set is returned as an array to the javascript object. the javascript object gets injected into the DOM. No parameters are passed in the ajax request to the server. thanks again for any insight folks. - sf
[jQuery] JQuery populating div with AJAX
Hi all I'm looking to populate a div with information from a database ... don't want to pass any parameters to the serverside script, just want the div updated according to my query if the db record sets are modified, is .ajaxStart() the appropriate function for this? I'm basically looking to have the jquery poll the server every X seconds. Since HTTP is a connectionless protocol, I'm not entirely sure what the proper way would be to stop/start the request using good practices. In pseudo-type code it should work like this: User visits site. a request is made from the client to the server to invoke a function. a function on the server-side queries my mysql database with a simple query. the result set is returned as an array to the javascript object. the javascript object gets injected into the DOM. No parameters are passed in the ajax request to the server. thanks again for any insight folks.
[jQuery] Re: JQuery populating div with AJAX
Hi!
Thanks so much for the reply.
This was the final set of code that I used that worked great for me:
$(document).ready(function() {
$('.pendingUsers').load('foo.php');
setInterval(function() {
$('.pendingUsers').load('foo.php');
}, 30);
});
The first load is to inject the data into the DOM after it loads.
Thanks all for the help!
- sf
On 8/10/07, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote:
Hi Steve,
What about this example?
$('#div-id').load('url.php');
More info can be found here:
http://docs.jquery.com/Ajax#load.28_url.2C_params.2C_callback_.29
Good luck!
Rick
[jQuery] New to jquery, adding/modify option box in a select block
Hi all, Given the enthusiasm of the community that surrounds jquery, in addition to the excellent documentation, I've decided to give it a go over prototype and the like. I have a rather simple inquiry that's more conceptual than technicalicaties of syntax. I'm currently writing an application for a car inventory. Users have the option to select make/model, etc, which ultimately adds the options to a database. My issue is right now I lack an existing database with car make/models, and I'm looking to incorporate some javascript to allow users to dynamically add/modify/remove options in a select block. Is JQuery the right tool for this? If so, would anyone be kind enough to point me in the right direction as far as documentation to begin reading so I can attempt an implementation? Thank you kindly all! Cheers, - sf
