jQuery Forum

Hi,

I dealing with some US addresses returned by server, some addresses come with +4 zip code. e.g. "El Monte, CA 91734-2135". How do I use jQuery to strip the "-2135" part? The users want to see "El Monte, CA 91734"

Thanks

Hi,

I need to change the data role of a div to either popup or nothing, say the following markup, I want pnlDealers to behave like a popup on some occasions but just as regular div on others. How do I do that? Thanks

1. <div id="pnlDealers" style="display:none"></div>
   

Hi,

I am having problem with this page:

http://codeturtle.com/files/list.html

When I click on any item, the selected item background turns to blue then turn back to normal, I am under the impression that selected item will remain blue background until other items are selected. If that is not the default behavior of JQM, how do I make it?

Thanks

Hi,

I am looking for jQruery table plugins that support data grouping, it should group rows that have same values and allow users to expand/collapse groups.

Thanks
 

Hi,

For jQuery UI Sortable, is there a way I can have value/text pair and allow me to store list of values into a variable? I look at the sample on:

http://jqueryui.com/demos/sortable/

Can not find what I want.

Thanks

Hi,
I have the html markup like this:

1. <tr class="rgGroupHeader"><td>Item 1</td><td></td></tr>
   <tr><td></td><td></td></tr>
   <tr><td></td><td></td></tr>
   <tr class="rgFooter"><td>Sum of Item 1</td><td>20</td></tr>
   <tr class="rgGroupHeader"><td>Item 2</td><td></td></tr>
   <tr><td></td><td></td></tr>
   <tr class="rgFooter"><td>Sum of item 2</td><td>40</td></tr>
   

I would like each .rgGroupHeader to find the first .rgFooter directly under and copy the second column value over. In this case the value 20 will be copies to the second td of first .rgGroupHeader row and 40 to the second .rgGroupHeader row. How do I do that?

Thanks  

Hi,

I am implementing hot keys to enable/disable menu bar of a page, here is my code snippet:

1. $(document).keyup(function(e) {
       // ctrl+alt+l to toggle logger
       if (e.ctrlKey && e.altKey && e.keyCode == 76) {
           $('#Menu').toggle();
           $('#Breadcrumb').toggle();
       }
   });
   

This is not working well for pages having iframe, when iframe has focus, the ctrl+alt+l combination has no effects. Any way I can get this to work with iframe?

Thanks

Hi,

I am creating a page very similar to:
http://jqueryui.com/demos/autocomplete/#remote-jsonp

I try to add a class to the labels so I can style them, here is my code snippet:

1. response($.map(list, function(s) {
       keyval = s.split('|');
       return { label: '[<span class="Code">' + keyval[0] + '</span>] ' + keyval[1], value: keyval[0] };
   }));
   
   

but labels are showing up as

1. [<span class="Code">ABC</span>] ABC Company

It seems AutoComplete plugin is doing html encoding, how do I prevent it?

Thanks  

Hi,
 I have question about the source code of this url:
http://jqueryui.com/demos/autocomplete/#remote-jsonp

The source code has the following snippet:

1.  $( "#city" ).autocomplete({ source: function( request, response ) { $.ajax({ url: "http://ws.geonames.org/searchJSON", dataType: "jsonp", data: { featureClass: "P", style: "full", maxRows: 12, name_startsWith: request.term },

I don't understand what is request.term in this snippet, it seems to be the value of the city text box, but its id is "city". So how is Request.term tied to city?

Thanks 

Hi,

I need to create a faked select box, the reason is because select box does not allow multiple column format, I have the following simple sample page: sample page

When user hovers the mouse over list item, the background color changes, which is good.  But I need to make it so the user can move up and down the list by using keyboard arrow keys.

Thanks  

Hi,

I am trying to use AutoComplete to work with a service page that returns items in plain text delimited by pipe, e.g. text 1 |text 2|text 3|text 4

Here is my code snippet:

1. $("#txtDescription").autocomplete({ source: getSearchValues, minLength: 1 });
   
   function getSearchValues(request, response) {
       $.ajax({
           url: "Search.ashx",
           dataType: "text",
           data: {
               type: readCookie('searchType'),
               rows: 10,
               value: $('#txtDescription').val()
           },
           success: function(data) {
               //what should I do here?
           }
       });
   }
   
   

The Firebug shows me the Ajax calls are successful, also if I put alert(data) in the success handler, it does show the correct result.but no autocomplete is happening, there is no drop down attached to the text box txtDescription either.  So what should I do to make the autocomplete happen?

Thanks

Hi,

I need help with tab interface I created. My html & javascript:

1. <ul id="tabs">
       <li>
           <a href="javascript:switchTab(1);">View Tab 1</a>
       </li>
       <li>
           <a href="javascript:switchTab(2);">View Tab 2</a>
       </li>
       <li>
           <a href="javascript:switchTab(3);">View Tab 3</a>
       </li>
       <li>
           <a href="javascript:switchTab(4);">View Tab 4</a>
       </li>
       <li>
           <a href="javascript:switchTab(5);">View Tab 5</a>
       </li>   
   </ul>
   <script type="text/javascript">
       function switchTab(tabNum) {
           $('#result1').hide();
           $('#result2').hide();
           $('#result3').hide();
           $('#result4').hide();
           $('#result5').hide();
   
           if (tabNum == 1) {
               $('#result1').show();
           }
           else if (tabNum == 2) {
               $('#result2').show();
           }
           else if (tabNum == 3) {
               $('#result3').show();
           }
           else if (tabNum == 4) {
               $('#result4').show();
           }
           else if (tabNum == 5) {
               $('#result5').show();
           }
       }
   
       function mouseIn() {
           $(this).addClass('hoverTab');
       }
   
       function mouseOut() {
           $(this).removeClass('hoverTab');
       }
   
       function tabClicked() {
           $(this).parents('li:first').siblings().removeClass('activeTab');
           $(this).parents('li:first').addClass('activeTab');
       }
   
       $(function() {
           $('#tabs li').hover(mouseIn, mouseOut);
           $('#tabs li a').click(tabClicked);
       });
   </script>
   
   

This is working fine, but as you can see I hard wire javascript calls to the html elements, are there ways to prevent that?
Second question:
If previous selected tab number is stored in cookie, how do I select the tab using javascript?

Thanks

Hi,

I have the following html markup:

1. <select id="isadmin" name="isadmin" class="shortField"><option>false</option><option>true</option></select>

I tried to use jQuery to set the value like this:

1. $('#isadmin').attr('value', data.isadmin);

data is a json result by calling some service page. This works with FF, but not with IE9. How do I make it so both browsers will work?

Thanks

Hi,

I have a div inside another div, I want to keep inner div centered vertically at the visible portion of outer div. Say the outer div is 3000px in height, most of the monitors can not display all of it, only a portion will be seen, I want the inner div to be centered in the view port, if users scroll down the browser window, they will see another portion of outer div but the inner div should still be centered vertically.

How do I do that?

TIA 

Hi,
 
Using jQuery, how do I make a function to execute when users press Ctrl+Q?  Or other combinations of Ctrl and a key.

TIA

Hi,

Is there a way to allow user to input value into the text box of a datepicker?  My code snippet:

1. $('#txtSubmitDate').datepicker({ buttonImage: '/Images/calendar.gif', showOn: 'button', buttonImageOnly: true });

I want the users to pick a date by clicking the calendar icon or enter date directly into txtSubmitDate

Thanks