Search Results

Search found 2172 results on 87 pages for 'ul'.

Page 66/87 | < Previous Page | 62 63 64 65 66 67 68 69 70 71 72 73  | Next Page >

  • jQuery: resizing element cuts off parent's background

    - by Justine
    Hi, I've been trying to recreate an effect from this tutorial: http://jqueryfordesigners.com/jquery-look-tim-van-damme/ Unfortunately, I want a background image underneath and because of the resize going on in JavaScript, it gets resized and cut off as well, like so: http://dev.gentlecode.net/dotme/index-sample.html - you can view source there to check the HTML, but basic structure looks like this: <div class="page"> <div class="container"> div.header ul.nav div.main </div> </div> Here is my jQuery code: $('ul.nav').each(function() { var $links = $(this).find('a'), panelIds = $links.map(function() { return this.hash; }).get().join(","), $panels = $(panelIds), $panelWrapper = $panels.filter(':first').parent(), delay = 500; $panels.hide(); $links.click(function() { var $link = $(this), link = (this); if ($link.is('.current')) { return; } $links.removeClass('current'); $link.addClass('current'); $panels.animate({ opacity : 0 }, delay); $panelWrapper.animate({ height: 0 }, delay, function() { var height = $panels.hide().filter(link.hash).show().css('opacity', 1).outerHeight(); $panelWrapper.animate({ height: height }, delay); }); }); var showtab = window.location.hash ? '[hash=' + window.location.hash + ']' : ':first'; $links.filter(showtab).click(); }); In this example, panelWrapper is a div.main and it gets resized to fit the content of tabs. The background is applied to the div.page but because its child is getting resized, it resizes as well, cutting off the background image. It's hard to explain so please look at the link above to see what I mean. I guess what I'm trying to ask is: is there a way to resize an element without resizing its parent? I tried setting height and min-height of .page to 100% and 101% but that didn't work. I tried making the background image fixed, but nada. It also happens if I add the background to the body or even html. Help?

    Read the article

  • Why is this unwanted ">" character being displayed when displaying this PHP document in a browser?

    - by CT
    This page takes an asset id from $_GET of the url and displays some info about the asset after querying a mysql database. When I view the page in my browser there is an unwanted "" character within the page and I have no idea why. I've commented where it appears. It appears before the < table create tag right afterward. The < table tag was originally outside the php script section but I threw it in to see if it made a difference. It did not. Thank you all. I am viewing the page in Firefox. The web server is running on an Ubuntu Server 10.04 virtual machine on my laptop. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" type="text/css" href="style.css" /> <title>Wagman IT Asset</title> </head> <body> <div id="page"> <div id="header"> <img src="images/logo.png" /> </div> </div> <div id="content"> <div id="container"> <div id="main"> <div id="menu"> <ul> <table width="100%" border="0"> <tr> <td><li><a href="index.php">Search Assets</a></li></td> <td><li><a href="browse.php">Browse Assets</a></li></td> <td><li><a href="add_asset.php">Add Asset</a></li></td> <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td> </tr> </table> </ul> </div> <div id="text"> <ul> <li> <h1>View Asset</h1> </li> </ul> //UNWANTED > CHARACTER APPEARS HERE <?php echo "<table width='100%' border='0' cellpadding='2'>"; //make database connect mysql_connect("localhost", "asset_db", "asset_db") or die(mysql_error()); mysql_select_db("asset_db") or die(mysql_error()); //get asset $id = $_GET["id"]; //get type of asset $sql = "SELECT asset.type From asset WHERE asset.id = $id"; $result = mysql_query($sql) or die(mysql_error()); $row = mysql_fetch_assoc($result); $type = $row['type']; switch ($type){ case "Server": $sql = " SELECT asset.id ,asset.company ,asset.location ,asset.purchase_date ,asset.purchase_order ,asset.value ,asset.type ,asset.notes ,server.manufacturer ,server.model ,server.serial_number ,server.esc ,server.user ,server.prev_user ,server.warranty FROM asset LEFT JOIN server ON server.id = asset.id WHERE asset.id = $id "; $result = mysql_query($sql); while($row = mysql_fetch_assoc($result)) { echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Asset ID:</td><td>"; $id = $row['id']; setcookie('id', $id); echo "$id</td></tr>"; echo "<tr<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>><td>Company:</td><td>"; $company = $row['company']; setcookie('company', $company); echo "$company</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Location:</td><td>"; $company = $row['location']; setcookie('location', $location); echo "$location</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Purchase Date:</td><td>"; $purchase_date = $row['purchase_date']; setcookie('purchase_date', $purchase_date); echo "$purchase_date</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Purchase Order:</td><td>"; $purchase_order = $row['purchase_order']; setcookie('purchase_order', $purchase_order); echo "$purchase_order</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Value:</td><td>"; $value = $row['value']; setcookie('value', $value); echo "$value</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Type:</td><td>"; $type = $row['type']; setcookie('type', $type); echo "$type</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Notes:</td><td>"; $notes = $row['notes']; setcookie('notes', $notes); echo "$notes</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Manufacturer:</td><td>"; $manufacturer = $row['manufacturer']; setcookie('manufacturer', $manufacturer); echo "$manufacturer</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Model / Description:</td><td>"; $model = $row['model']; setcookie('model', $model); echo "$model</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Serial Number / Service Tag:</td><td>"; $serial_number = $row['serial_number']; setcookie('serial_number', $serial_number); echo "$serial_number</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Express Service Code:</td><td>"; $escy = $row['esc']; setcookie('esc', $esc); echo "$esc</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>User:</td><td>"; $user = $row['user']; setcookie('user', $user); echo "$user</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Previous User:</td><td>"; $prev_user = $row['prev_user']; setcookie('prev_user', $prev_user); echo "$prev_user</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Warranty:</td><td>"; $warranty = $row['warranty']; setcookie('warranty', $warranty); echo "$warranty</td></tr></table>"; } break; case "Laptop": $sql = " SELECT asset.id ,asset.company ,asset.location ,asset.purchase_date ,asset.purchase_order ,asset.value ,asset.type ,asset.notes ,laptop.manufacturer ,laptop.model ,laptop.serial_number ,laptop.esc ,laptop.user ,laptop.prev_user ,laptop.warranty FROM asset LEFT JOIN laptop ON laptop.id = asset.id WHERE asset.id = $id "; $result = mysql_query($sql); while($row = mysql_fetch_assoc($result)) { echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Asset ID:</td><td>"; $id = $row['id']; setcookie('id', $id); echo "$id</td></tr>"; echo "<tr<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>><td>Company:</td><td>"; $company = $row['company']; setcookie('company', $company); echo "$company</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Location:</td><td>"; $company = $row['location']; setcookie('location', $location); echo "$location</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Purchase Date:</td><td>"; $purchase_date = $row['purchase_date']; setcookie('purchase_date', $purchase_date); echo "$purchase_date</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Purchase Order:</td><td>"; $purchase_order = $row['purchase_order']; setcookie('purchase_order', $purchase_order); echo "$purchase_order</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Value:</td><td>"; $value = $row['value']; setcookie('value', $value); echo "$value</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Type:</td><td>"; $type = $row['type']; setcookie('type', $type); echo "$type</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Notes:</td><td>"; $notes = $row['notes']; setcookie('notes', $notes); echo "$notes</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Manufacturer:</td><td>"; $manufacturer = $row['manufacturer']; setcookie('manufacturer', $manufacturer); echo "$manufacturer</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Model / Description:</td><td>"; $model = $row['model']; setcookie('model', $model); echo "$model</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Serial Number / Service Tag:</td><td>"; $serial_number = $row['serial_number']; setcookie('serial_number', $serial_number); echo "$serial_number</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Express Service Code:</td><td>"; $escy = $row['esc']; setcookie('esc', $esc); echo "$esc</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>User:</td><td>"; $user = $row['user']; setcookie('user', $user); echo "$user</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Previous User:</td><td>"; $prev_user = $row['prev_user']; setcookie('prev_user', $prev_user); echo "$prev_user</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Warranty:</td><td>"; $warranty = $row['warranty']; setcookie('warranty', $warranty); echo "$warranty</td></tr></table>"; } break; case "Desktop": $sql = " SELECT asset.id ,asset.company ,asset.location ,asset.purchase_date ,asset.purchase_order ,asset.value ,asset.type ,asset.notes ,desktop.manufacturer ,desktop.model ,desktop.serial_number ,desktop.esc ,desktop.user ,desktop.prev_user ,desktop.warranty FROM asset LEFT JOIN desktop ON desktop.id = asset.id WHERE asset.id = $id "; $result = mysql_query($sql); while($row = mysql_fetch_assoc($result)) { echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Asset ID:</td><td>"; $id = $row['id']; setcookie('id', $id); echo "$id</td></tr>"; echo "<tr<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>><td>Company:</td><td>"; $company = $row['company']; setcookie('company', $company); echo "$company</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Location:</td><td>"; $company = $row['location']; setcookie('location', $location); echo "$location</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Purchase Date:</td><td>"; $purchase_date = $row['purchase_date']; setcookie('purchase_date', $purchase_date); echo "$purchase_date</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Purchase Order:</td><td>"; $purchase_order = $row['purchase_order']; setcookie('purchase_order', $purchase_order); echo "$purchase_order</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Value:</td><td>"; $value = $row['value']; setcookie('value', $value); echo "$value</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Type:</td><td>"; $type = $row['type']; setcookie('type', $type); echo "$type</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Notes:</td><td>"; $notes = $row['notes']; setcookie('notes', $notes); echo "$notes</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Manufacturer:</td><td>"; $manufacturer = $row['manufacturer']; setcookie('manufacturer', $manufacturer); echo "$manufacturer</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Model / Description:</td><td>"; $model = $row['model']; setcookie('model', $model); echo "$model</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Serial Number / Service Tag:</td><td>"; $serial_number = $row['serial_number']; setcookie('serial_number', $serial_number); echo "$serial_number</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Express Service Code:</td><td>"; $escy = $row['esc']; setcookie('esc', $esc); echo "$esc</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>User:</td><td>"; $user = $row['user']; setcookie('user', $user); echo "$user</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Previous User:</td><td>"; $prev_user = $row['prev_user']; setcookie('prev_user', $prev_user); echo "$prev_user</td></tr>"; echo "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><td>Warranty:</td><td>"; $warranty = $row['warranty']; setcookie('warranty', $warranty); echo "$warranty</td></tr></table>"; } break; } ?> </div> </div> </div> <div class="clear"></div> <div id="footer" align="center"> <p>&nbsp;</p> </div> </div> <div id="tagline"> Wagman Construction - Bridging Generations since 1902 </div> </body> </html>

    Read the article

  • jQuery tablesorter - loss of functionality after AJAX call

    - by Nick
    I have recently been experimenting with the tablesorter plugin for jQuery. I have successfully got it up and running in once instance, and am very impressed. However, I have tried to apply the tablesorter to a different table, only to encounter some difficulties... Basically the table causing a problem has a <ul> above it which acts as a set of tabs for the table. so if you click one of these tabs, an AJAX call is made and the table is repopulated with the rows relevant to the specific tab clicked. When the page initially loads (i.e. before a tab has been clicked) the tablesorter functionality works exactly as expected. But when a tab is clicked and the table repopulated, the functionality disappears, rendering it without the sortable feature. Even if you go back to the original tab, after clicking another, the functionality does not return - the only way to do so is a physical refresh of the page in the browser. I have seen a solution which seems similar to my problem on this site, and someone recommends using the jQuery plugin, livequery. I have tried this but to no avail :-( If someone has any suggestions I would be most appreciative. I can post code snippets if it would help (though I know the instantiation code for tablesorter is fine as it works on tables with no tabs - so it's definitely not that!) EDIT: As requested, here are some code snippets: The table being sorted is <table id="#sortableTable#">..</table>, the instantiation code for tablesorter I am using is: $(document).ready(function() { $("#sortableTable").tablesorter( { headers: //disable any headers not worthy of sorting! { 0: { sorter: false }, 5: { sorter: false } }, sortMultiSortKey: 'ctrlKey', debug:true, widgets: ['zebra'] }); }); And I tried to rig up livequery as follows: $("#sortableTable").livequery(function(){ $(this).tablesorter(); }); This has not helped though... I am not sure whether I should use the id of the table with livequery as it is the click on the <ul> I should be responding to, which is of course not part of the table itself. I have tried a number of variations in the hope that one of them will help, but to no avail :-(

    Read the article

  • Create a nested list

    - by sico87
    How would I create a nested list, I currently have this public function getNav($cat,$subcat){ //gets all sub categories for a specific category if(!$this->checkValue($cat)) return false; //checks data $query = false; if($cat=='NULL'){ $sql = "SELECT itemID, title, parent, url, description, image FROM p_cat WHERE deleted = 0 AND parent is NULL ORDER BY position;"; $query = $this->db->query($sql) or die($this->db->error); }else{ //die($cat); $sql = "SET @parent = (SELECT c.itemID FROM p_cat c WHERE url = '".$this->sql($cat)."' AND deleted = 0); SELECT c1.itemID, c1.title, c1.parent, c1.url, c1.description, c1.image, (SELECT c2.url FROM p_cat c2 WHERE c2.itemID = c1.parent LIMIT 1) as parentUrl FROM p_cat c1 WHERE c1.deleted = 0 AND c1.parent = @parent ORDER BY c1.position;"; $query = $this->db->multi_query($sql) or die($this->db->error); $this->db->store_result(); $this->db->next_result(); $query = $this->db->store_result(); } return $query; } public function getNav($cat=false, $subcat=false){ //gets a list of all categories form this level, if $cat is false it returns top level nav if($cat==false || strtolower($cat)=='all-products') $cat='NULL'; $ds = $this->data->getNav($cat, $subcat); $nav = $ds ? $ds : false; $html = ''; //create html if($nav){ $html = '<ul>'; //var_dump($nav->fetch_assoc()); while($row = $nav->fetch_assoc()){ $url = isset($row['parentUrl']) ? $row['parentUrl'].'/'.$row['url'] : $row['url']; $current = $subcat==$row['url'] ? ' class="current"' : ''; $html .= '<li'.$current.'><a href="/'.$url.'/">'.$row['title'].'</a></li>'; } $html .='</ul>'; } return $html; } The sql returns parents and children, for each parent I need the child to nest in a list.

    Read the article

  • What's wrong with this code? Values not saved to db

    - by Scott B
    Been trying to get this code to work for several days now to no avail. I'm at wits end. I've managed, with the code below, to create a customized category picker widget that appears on the PAGE editor. However, for the life of me, I cannot get the checked categories to save. function my_post_options_box() { if ( function_exists('add_meta_box') ) { //add_meta_box( $id, $title, $callback, $page, $context, $priority ); add_meta_box('categorydiv', __('Page Options'), 'post_categories_meta_box_modified', 'page', 'side', 'core'); } } //adds the custom categories box function post_categories_meta_box_modified($post) { $noindexCat = get_cat_ID('noindex'); $nofollowCat = get_cat_ID('nofollow'); if(in_category("noindex")){ $noindexChecked = " checked='checked'";} else {$noindexChecked = "";} if(in_category("nofollow")){ $nofollowChecked = " checked='checked'";} else {$noindexChecked = "";} ?> <div id="categories-all" class="ui-tabs-panel"> <ul id="categorychecklist" class="list:category categorychecklist form-no-clear"> <li id='category-<?php echo $noindexCat ?>' class="popular-category"><label class="selectit"><input value="<?php echo $noindexCat ?>" type="checkbox" name="post_category[]" id="in-category-<?php echo $noindexCat ?>"<?php echo $noindexChecked ?> /> noindex</label></li> <li id='category-<?php echo $nofollowCat ?>' class="popular-category"><label class="selectit"><input value="<?php echo $noindexCat ?>" type="checkbox" name="post_category[]" id="in-category-<?php echo $nofollowCat ?>"<?php echo $nofollowChecked ?> /> nofollow</label></li> <li id='category-1' class="popular-category"><label class="selectit"><input value="1" type="checkbox" name="post_category[]" id="in-category-1" checked="checked"/> Uncategorized</label></li> </ul> </div> <?php }

    Read the article

  • Contact form with php-script does not work

    - by elajjas
    I'm new to the forum and I have been trying to find a thread that could be helpful but nothing have been working out so far. I recently uploaded my site via FTP, and it works fine. Except for one thing, my contact form. The contact form is crucial and it is almost the whole point of the website. I don't get any emails "from the form", either in my spam-folder or inbox. Please have a look at the website which is: http://www.adspot.se The contact form is situated on: http://www.adspot.se/contact.html The php script looks like this: <?php if (isset($_REQUEST['email'])) //if "email" is filled out, send email { //send email $name = $_REQUEST['name'] ; $email = $_REQUEST['email'] ; $message = $_REQUEST['message'] ; mail("[email protected]", $name, $message, "From:" . $email); } ?> I've already tried different types of php-scripts, but it still doesn't seem to work. UPDATE: Changed the form code to: <form method="POST" action="email.php"> <div class="row half"> <div class="6u"> <input name="name" placeholder="Name" type="text" class="text" /> </div> <div class="6u"> <input name="email" placeholder="Email" type="text" class="text" /> </div> </div> <div class="row half"> <div class="12u"> <textarea name="message" placeholder="Message"></textarea> </div> </div> <div class="row half"> <div class="12u"> <ul class="action"> <input type="submit" class="action"> </ul> </div> </div> </form> Now it redirects me to www.adspot.se/email.php but still no emails received...

    Read the article

  • Multiple checkbox values search javascript

    - by JV10
    I have a list of keywords, and I've created a checkbox for each. My template has a form wrapping the content, so I can't have a nested form around the checkbox list. How can I send the selected checkbox values to my search results page? The form that wraps the content doesn't have any actions or methods applied: <form id="BoostMasterForm" runat="server"> This the HTML markup of my checkbox list: <div class="checkboxes"> <ul> <li> <input type="checkbox" name="search" class="options" value="one"> <label>one</label> </li> <li> <input type="checkbox" name="search" class="options" value="two"> <label>two</label> </li> <li> <input type="checkbox" name="search" class="options" value="three"> <label>three</label> </li> </ul> <input type="submit" value="Submit"/> </div> How can I use javascript or jQuery to submit the values of the multiple checkbox selections and on submit action them to the following URL: '/imagery/image-search.aspx' The resulting URL for a search where option 1 and 3 are submitted should be: '/imagery/image-search.aspx?search=one%20three' I'm using this javascript that I found on another post, however I need it to append the form an the action and the method. My website is ASP, where this post is for a PHP site: Sending multiple checkbox options $('.options').click(function() { var selectedItems = new Array(); $(".checkboxes input:checkbox[name=search]:checked").each(function() {selectedItems.push($(this).val());}); var data = selectedItems.join('|'); $("#opts").val(data); }); If anyone can help, it'd be greatly appreciated. Cheers, JV

    Read the article

  • Rails has-and-belongs-to-many form question

    - by swilliams
    Sorry for the semi-generic title, but I'm still pretty new at rails and couldn't think of a succinct way to put the question. I have a basic habtm model setup: a Project has many Resources and a Resource can have many Projects. I have the database and models setup properly, and can do everything I need to via the console, but I'm having trouble translating it all into the view. On the show view for the Project, I want to be able to create a Resource and automatically assign it to the current Project. Here's my basic html: <p> <b>Name:</b> <%=h @project.name %> </p> <h2>Equipment</h2> <ul> <% @project.resources.each do |r| %> <li><%=h r.name %></li> <% end %> </ul> <h2>Add A Resource</h2> <% form_for(@project) do |f| %> <%= f.error_messages %> <p> Resource Name:<br /> <%= f.text_field :resources %> </p> <p> <%= f.submit 'Create' %> </p> <% end %> Obviously, that form won't work, but I'm at a loss for what to do next. I've searched around for various examples, but haven't found one for what I'm trying to do here. One thing I've thought of was to change the form to be form_for(Resource.new) and include a hidden input of the @project.id. And then when the resource_controller handles the form, check for that id and go from there. That seems like an ugly kludge though.

    Read the article

  • .NET: Is there a way to finagle a default namespace in an XPath 1.0 query?

    - by Cheeso
    I'm building a tool that performs xpath 1.0 queries on XHTML documents. The requirement to use a namespace prefix in the query is killing me. The query looks like this: html/body/div[@class='contents']/div[@class='body']/ div[@class='pgdbbyauthor']/h2[a[@name][starts-with(.,'Quick')]]/ following-sibling::ul[1]/li/a (all on one line) ...which is bad enough, except because it's xpath 1.0, I need to use an explicit namespace prefix on each QName, so it looks like this: ns1:html/ns1:body/ns1:div[@class='contents']/ns1:div[@class='body']/ ns1:div[@class='pgdbbyauthor']/ns1:h2[ns1:a[@name][starts-with(.,'Quick')]]/ following-sibling::ns1:ul[1]/ns1:li/ns1:a To set up the query, I do something like this: var xpathDoc = new XPathDocument(new StringReader(theText)); var nav = xpathDoc.CreateNavigator(); var xmlns = new XmlNamespaceManager(nav.NameTable); foreach (string prefix in xmlNamespaces.Keys) xmlns.AddNamespace(prefix, xmlNamespaces[prefix]); XPathNodeIterator selection = nav.Select(xpathExpression, xmlns); But what I want is for the xpathExpression to use the implicit default namespace. Is there a way for me to transform the unadorned xpath expression, after it's been written, to inject a namespace prefix for each element name in the query? I'm thinking, anything between two slashes, I could inject a prefix there. Excepting of course axis names like "parent::" and "preceding-sibling::" . And wildcards. That's what I mean by "finagle a default namespace". Is this hack gonna work? Addendum Here's what I mean. suppose I have an xpath expression, and before passing it to nav.Select(), I transform it. Something like this: string FixupWithDefaultNamespace(string expr) { string s = expr; s = Regex.Replace(s, "^(?!::)([^/:]+)(?=/)", "ns1:$1"); // beginning s = Regex.Replace(s, "/([^/:]+)(?=/)", "/ns1:$1"); // stanza s = Regex.Replace(s, "::([A-Za-z][^/:*]*)(?=/)", "::ns1:$1"); // axis specifier s = Regex.Replace(s, "\\[([A-Za-z][^/:*\\(]*)(?=[\\[\\]])", "[ns1:$1"); // predicate s = Regex.Replace(s, "/([A-Za-z][^/:]*)(?!<::)$", "/ns1:$1"); // end s = Regex.Replace(s, "^([A-Za-z][^/:]*)$", "ns1:$1"); // edge case s = Regex.Replace(s, "([-A-Za-z]+)\\(([^/:\\.,\\)]+)(?=[,\\)])", "$1(ns1:$2"); // xpath functions return s; } This actually works for simple cases I tried. To use the example from above - if the input is the first xpath expression, the output I get is the 2nd one, with all the ns1 prefixes. The real question is, is it hopeless to expect this Regex.Replace approach to work, as the xpath expressions get more complicated?

    Read the article

  • Assign an existing click event function to another click event using jquery

    - by Peter Delahunty
    Ok so i have some html like this: <div id="navigation"> <ul> <li> <a>tab name</a> <span class="delete-tab">X</span> </li> <li> <a>tab name</a> <span class="delete-tab">X</span> </li> <li> <a>tab name</a> <span class="delete-tab">X</span> </li> <li class="selected"> <a>tab name</a> <span class="tab-del-btn">X</span> </li> </ul> </div> I then have javascript that is excuted on the page that i do not control (this is in liferay portal). I want to then manipulate things afterwards with my own custom javascript. SO... For each of the span.delete-tab elements an on-click event function has been assign earlier. It is the same function call for each span. I want to take that function (any) and call it from the click event of the span.tab-del-btn ? This is what i tried to do: var navigation = jQuery('#navigation'); var navTabs = navigation.find('.delete-tab'); var existingDeleteFunction = null; navTabs.each(function (i){ var tab = jQuery(this); existingDeleteFunction = tab.click; }); var selectedTab = jQuery('#navigation li.selected'); var deleteBtn = selectedTab.find('.tab-del-btn'); deleteBtn.click(function(event){ existingDeleteFunction.call(this); }); It does not work though. existingDeleteFunction is not the original function it is some jquery default function. Any ideas?

    Read the article

  • Ie7 float problems and hiperlinks not clickable

    - by Uffo
    Markup <ul class="navigation clearfix"> <li class="navigation-top"></li> <div class="first-holder" style="height:153px;"> <dl class="hold-items clearfix"> <dd class="clearfix with"><a href="http://site.com" title="Protokoll">Protokoll</a></dd> <dd class="with-hover"><a href="http://site.com" title="Mein/e Unternehmen">Mein/e Unternehmen</a></dd> <dd class="with"><a class="face-me" href="http://site.com" title="Erweiterte Suche">Erweiterte Suche</a></dd> <dd class="with"><a href="http://site.com" title="Abmelden">Abmelden</a></dd> </dl> </div><!--[end] /.first-holder--> <li class="navigation-bottom"></li> </ul><!--[end] /.navigation--> Css: .first-holder{height:304px;position:relative;width:178px;overflow:hidden;margin-bottom:0px;padding-bottom: 0px;} .hold-items{top:0px;position:absolute;} .navigation dd.with{line-height:38px;background:url('/images/sprite.png') no-repeat -334px -46px;width:162px;height:38px;padding-bottom:0px;overflow: hidden;} .navigation dd.with a{position:relative;outline:0;display:block;font-weight:bold;color:#3f78c0;padding-left:10px;line-height:38px;} .with-hover{background:url('/images/sprite.png') no-repeat -505px -47px;width:178px;height:38px;line-height:38px;overflow:none;} .with-hover a{position:relative;display:block;font-weight:bold;color:#fff;padding-left:10px} .navigation-top{background:url('/images/sprite.png') no-repeat -694px -46px;width:160px;height:36px;} .navigation-top a{display:block;outline:0;height:20px;padding-top:18px;padding-left:138px;} .navigation-top a span{display:block;background:url('/images/sprite.png') no-repeat -212px -65px;width:8px;height:6px;} .navigation-bottom{background:url('/images/sprite.png') no-repeat -784px -402px;width:160px;height:37px;} .navigation-bottom a{display:block;outline:0;height:20px;padding-top:18px;padding-left:138px;} .navigation-bottom a span{display:block;background:url('/images/sprite.png') no-repeat -212px -74px;width:8px;height:6px;} Also the links, are not clickable, if I click on a link in IE7 it doesn't do the action..it doesn't redirect me to the location. This is how it looks in IE7: http://screencast.com/t/MGY4NjljZjc This is how it look in IE8,Firefox,Chrome and so on http://screencast.com/t/MzhhMDQ1M What I'm doing wrong PS: .navigation-top a span and .navigation-bottom a span I'm using some where else, but that it's ok it works fine.

    Read the article

  • Implementing hoverIntent for Drop Down Menu (coming from click_event)

    - by stormeTrooper
    I've just recently started programming, I was hoping for some help. I have a drop down menu that was originally activated by click_event, however I want to now implement hoverIntent in order to make the menu drop. The issue I am having now is being able to use the menu, because whenever I invoke the menu now, once I leave the area that activates the menu, the menu closes. If you could explain to me like I'm five, I'd appreciate it, thanks :) The code I am using as follows: JavaScript: function setupUserConfigMenu() { $('.user_profile_btn').hoverIntent( function (event) { $('#user_settings_dropdown').animate({height:['toggle', 'swing'] }, 225); }, function (event) { $('#user_settings_dropdown').animate({height:['toggle', 'swing'] }, 225); }) } HTML: <li> <a href="<%= "#" %>" class="user_profile_btn" title="Your profile page"><%= truncate(current_user.full_name || current_user.name, :length => 28) %> <div class="arrow_down"></div></a> <ul id="user_settings_dropdown"> <li> <a href="<%= current_user.get_url(true) %>"> <%= image_tag current_user.get_thumb_url, :size => "30x30" %> <div> <%= truncate(current_user.full_name || current_user.name, :length => 40) %> <br> View profile </div> </a> </li> <div class="grey_line"></div> <li class="settings_list_item"> <%= link_to "Settings", edit_user_registration_path %> </li> <li class="settings_list_item"> <%= link_to "About", "/about" %> </li> <li class="settings_list_item"> <%= link_to "Logout", destroy_user_session_path, :method => :delete %> </li> </ul> </li>

    Read the article

  • .live event doesnt work till second click

    - by ChampionChris
    I have 2 list on a page that are linked. When I drag a li element from list 1 to list 2 the live events on list 1 don't work on the first click only second click. Below is the code that adds the li (obj) to list 2. function AddToDropBox(obj) { $(obj).children(".handle").animate({ width: "20px" }).children("strong").fadeOut(); $(obj).children("span:not(.track,.play,.handle,:has(.btn-edit))").fadeOut('fast'); $(obj).children(".play").css("margin-right", "8px"); $(obj).css({ "opacity": "0.0", "width": "284px" }).animate({ opacity: "1.0" }); if ($(".sidebar-drop-box ul").children(".admin-song").length > 0) { $(".dropTitle").fadeOut("fast"); $(".sidebar-drop-box ul.admin-song-list").css("min-height", "0"); } if (typeof SetLinks == 'function') { SetLinks(); } //CBG Changes adds media ID to hidden field //checks id there is a value in field then adds comma if(document.getElementById("ctl00_cphBody_hfRemoveMedia").value==""||document.getElementById("ctl00_cphBody_hfRemoveMedia").value==null) { document.getElementById("ctl00_cphBody_hfRemoveMedia").value=(obj).attr("mediaid"); } else { var localMediaIDs=document.getElementById("ctl00_cphBody_hfRemoveMedia").value; document.getElementById("ctl00_cphBody_hfRemoveMedia").value=localMediaIDs+", "+(obj).attr("mediaid"); } // alert("hfid: "+document.getElementById("ctl00_cphBody_hfRemoveMedia").value); //END CBG Modifications } this is one of the live() events that dont fire until the second click after the drag. This live() event is in a document.ready function(). // Live for deleting. $(".btn-del").live("click", function(e) { DeleteItem(this); $(this).removeClass("btn-del").addClass("btn-add").parents("li").removeClass("alt").addClass("removed"); var oldTxt = $(this).parents("li").find(".status").text(); $(this).parents("li").find(".status").text("Removed").attr("oldstat", oldTxt); $("#timeHolder input[type=hidden]").val(($("#timeHolder input[type=hidden]").val() * 1) - ($(this).parents("li").find(".time").attr("length") * 1)); CalculateAggregates(); isDirty = false; }); EDIT @dreaton.. Im new to jquery and javascript so thanks for the last tip... Im not sure what you mean about cache the query's. ... the delegete feature is giving me this Microsoft JScript runtime error: Object doesn't support this property or method this is the way I have the code $('#ulPlaylist').delegate('.btn-del', 'click', function (e) { DeleteItem(this); $(this).removeClass("btn-del").addClass("btn-add").parents("li").removeClass("alt").addClass("removed"); var oldTxt = $(this).parents("li").find(".status").text(); $(this).parents("li").find(".status").text("Removed").attr("oldstat", oldTxt); $("#timeHolder input[type=hidden]").val(($("#timeHolder input[type=hidden]").val() * 1) - ($(this).parents("li").find(".time").attr("length") * 1)); CalculateAggregates(); isDirty = false; });

    Read the article

  • HTML-like GUI Framework in Java

    - by wintermute
    I was recently brought onto a project where we are developing a lot GUI elements for BlackBerry devices. The standard RIM APIs are pretty basic, almost never do what is required and are difficult or impossible to extend, so we end up re-implementing chunks of it. Currently the code we have isn't super organized and factored so there are lots of little tricks that get implemented over and over again. I had a thought about how to aid development efforts on this platform and wanted to see if the community could tell me if I'm still sane or if I've gone totally nuts. By far, the biggest organizational problem I've run into is making sure that each screen is laid out properly with proper padding and such. The current approach is to manually keep track of padding like so: protected void sublayout(int width, int height) { final int padding = 5; int y = padding; int x = padding; layoutChild(_someChild, width - padding * 2, height / 3 - padding * 2); setPositionChild(_someChild, x, y); y += _someChild.getHeight() + padding; // Calculate where to start drawing next. /* ... snipped ... */ } As you can see, positioning elements on a screen is a nightmare due to the tedium. I have investigated other GUI frameworks but, for a variety of reasons, it is difficult to find one that suites our purposes. One potential solution that came to me is to create a GUI framework who's API resembles HTML/CSS. This would allow for things like padding, margins, borders and colours to be handled through a sort of CSS API while the content would be organized using the HTML part of the API. It might look something like this: public class OptionsScreen extends Document { public OptionsScreen() { // You would set the style (like CSS style) through the constructor. Div content = new Div(new Style(new Padding(5), Color.BLACK)); // Then build up a tree of elements which can each have their own style's. // Each element knows how to draw itself, but it doesn't have to worry about // manually handling things like padding. // content.addChild(new P("This is a paragraph", new Style(new Padding(), Color.RED))); Ul list = new Ul(); list.addChild(new Li("item 1")); list.addChild(new Li("item 2")); content.addChild(list); addChild(content); } } I can imagine this making it easier to customize the UI of our app (which is very important) with different fonts, colours and layouts. Does this idea belong on The Daily WTF or do you think there is some promise?

    Read the article

  • Swapping two jQuery draggable list items not working properly (with jsFiddle example)

    - by Tony_Henrich
    The minimalist working example below swaps the two boxes when box 'one' is dragged and dropped on box 'two'. The problem is that when box 'one' is dropped, its style has 'top' & 'left' values causing it to be placed away from where it should drop. Its class includes 'ui-draggable-dragging'. It seems the top & left values are related to the amount the elements were dragged before the drop. And the dragging was 'interrupted' hence the residual 'ui-draggable-dragging' class? What am I missing to make the swap work seamlessly? full jsfiddle example here <html> <head> <script type="text/javascript" src="includes/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="includes/jquery-ui-1.8.2.custom.min.js"></script> <script type="text/javascript"> jQuery.fn.swapWith = function(to) { return this.each(function() { var copy_to = $(to).clone(true); var copy_from = $(this).clone(true); $(to).replaceWith(copy_from); $(this).replaceWith(copy_to); }); }; $(document).ready(function() { options = {revert: true}; $("li").draggable(options) $('#wrapper').droppable({ drop: function(event, ui) { $(ui.draggable).swapWith($('#two')); } }); }); </script> </head> <body> <form> <ul id="wrapper"> <li id='one'> <div style="width: 100px; height: 100px; border: 1px solid green"> one<br /></div> </li> <li id='two'> <div style="width: 110px; height: 110px; border: 1px solid red"> two<br /></div> </li> </ul> <br /> </form> </body> </html>

    Read the article

  • How to use input type="tel" in a contact form

    - by user1678664
    PHP newbie here trying to use a simple contact form. The fields I have are: "Name", "Email", "Phone", and "Message". I am trying to figure out what to do with the "Phone" field – I want it to output to the same place that "Message" does, so that when the email is received it will output both the message and the phone number to the body of the email. How do I do this? if( isset( $_POST['submit'] ) ) : wp_mail( get_option( 'admin_email' ), 'Website Contact Form', ( isset($_POST['message'] ) ? $_POST['message'] : '(blank)' ), 'From: ' . ( isset( $_POST['from_name'] ) ? $_POST['from_name'] : 'Website Contact Form' ) . ' <' . ( isset( $_POST['from_email'] ) ? $_POST['from_email'] : get_option( 'admin_email' ) ). '>' . "\r\n" ); $output = '<p>Thank you! Your message has been sent.</p>'; else : $output = ' <form action="" method="post"><ul> <li> <label for="from_name">Name</label> <input type="text" name="from_name" id="from_name" /> </li> <li> <label for="from_email">Email</label> <input type="email" name="from_email" id="from_email" /> </li> <li> <label for="from_tel">Phone</label> <input type="tel" name="from_tel" id="from_tel" /> </li> <li> <textarea name="message" id="message"></textarea> </li> <li class="submit"> <input name="submit" type="submit" value="Say Hello!" /> </li> </ul></form>'; endif; return $output;

    Read the article

  • preload image with jquery

    - by robertdd
    Updated: firs append a empty image and a span with some text hide the loading image, after it's load it's show the image var pathimg = "path/to/image" + "?" + (new Date()).getTime(); $('#somediv').append('<div><span>loading..</span><img id="idofimage" src="" alt="" ></div>') jQuery("#idofimage").hide().attr({"src":pathimg}) .load(function() { jQuery(this).show(); }); old post ok, I spent 2 days trying to preloaded images but no succes! i have this function: jQuery.getlastimage = function(id) { $.getjs(); $.post('operations.php', {'operation':'getli', 'id':id,}, function(lastimg){ $("#upimages" + id).html('<a href="uploads/'+ lastimg +'?'+ (new Date()).getTime() +'"><img class="thumbs" id="' + id + '" alt="' + lastimg + '" src="uploads/' + lastimg +'?'+ (new Date()).getTime() + '" /></a>'); }); }; lastimg is the name of the image while the image loading i want to appear a gif or a text "Loading...". the function will get something like this: <div class="upimage"> <ul class="thumbs" id="upimagesQueue"> **<li id="#upimagesRIFDIB"> <a href="uploads/0001.jpg?1271800088379"> <img src="uploads/0001.jpg?1271800088379" alt="0001.jpg" id="RIFDIB" class="thumbs"> </a> </li>** <li> .... </li> </ul> </div> i tried like this: ... $.post('operations.php', {'operation':'getli', 'id':id,}, function(lastimg){ $("#upimages" + id) .html('<a href="uploads/'+ lastimg +'?'+ (new Date()).getTime() +'"><img class="thumbs" id="' + id + '" alt="' + lastimg + '" src="uploads/' + lastimg +'?'+ (new Date()).getTime() + '" /></a>') .hide() .load(function() { $(this).show(); }); ... but all the <li> will hide and after is loading the image appear, i want the <li> to apear with a gif or a text in it and after the image is loaded the link and the image to apear! How to do this? Anyone have an idea? Thanks!

    Read the article

  • Simple html page using Bootstrap

    - by Athashri
    I am writing a simple HTML page using the Twitter Bootstrap. But the navbar and links are rendered as normal HTML on the browser. I have referred to multiple sites but the same steps are given everywhere. I am not sure where I am going wrong. Code: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <link rel= "stylesheet" href= "css/bootstrap.css" type="text/css"> <title> Bootstrap example</title> </head> <body> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="js/bootstrap.js"></script> <h1>Hello, world!</h1> <div class ="container"> <h1><a href="#">Bootstrap Site</a></h1> <div class="navbar"> <div class="navbar-inner"> <div class="container"> <ul class="nav"> <li class="active"><a href="#">Home</a></li> <li><a href="#">Projects</a></li> <li><a href="#">Services</a></li> <li><a href="#">Downloads</a></li> <li><a href="#">About</a></li> <li><a href="#">Contact</a></li> </ul> </div> </div> </div> </div> </body> </html>

    Read the article

  • Little CSS problem with Auto height and nested div's

    - by GeekDrop.com
    So I'm finally learning my way around CSS more and have run into a small problem. I have a container div, with a few divs inside of it, one of them is a bit if text (which can be a random height) and an image that will have a MAX height of 200px. I am using a dotted/colored background behind them that needs to auto expand to the height of whichever is the tallest, either the text or the image. Right now when i use height:auto on the container div it works perfect for the random height text: Example Screenshot But it's only adjusting according to the text's height; if the image is taller than the text, the image overflows the bottom of the background dotted/colored box. Example Screenshot The CSS I'm using currently is this: h1 div#like_detailed { margin: 0; font-size: 1.1em; width: 700px; } #details-image img { border: none; clear: left; float: right; margin: -45px 0 0 0; max-height: 200px; padding: 0 7px 0 10px; } #deets-container { background-color: #FEF; border: #190AE7 1px dotted; height: auto; margin-top: 0; margin-bottom: 30px; padding-top: 10px; padding-right: 10px; padding-left: 10px; padding-bottom: 0; } And the HTML for it is this: <div id="deets-container" class="rounded"> <!-- Button --> <div class="likebtnframe">(some code)</div> <!-- Button --> <div class="tweetbtnframe">(some code)</div> <!-- Button --> <ul id="share"> <li><a name="share">(some code)</a></li> </ul> <!-- Submitted By --> <div class="submitter_detailed"><span class="submitter-color smalltext">(some code)</span> (some code)</div> <!-- Image --> <div id="**details-image**">(some code)</div> <!-- Like / Quote --> <h1 id="**like_detailed**">(some code)</h1> </div> I have a feeling this is pretty easy but I'm running out of time to sort it out on my own. Anyone?

    Read the article

  • ScrollTo and toggle div

    - by user1466260
    I'm a big fan ov 8020.com and my goal is to create a porfolio with the same functionality like the one they have. Here is my markup This section should be hidden <section id="work-container"> <div id="work-list-51" class="work-details"> <h1> <div class="close-project"> </div> <div id="work-list-52" class="work-details"> <h1> <div class="close-project"> </div> <div id="work-list-53" class="work-details"> <h1> <div class="close-project"> </div> </section> This section will hold the thumbnails. When you click a thumbnail you will scroll to the top and the div will slidetoggle. <ul id="work-list"> <li id="work-list-51"><a data-page="51" href="#work-list-51"> <img width="230" height="230" alt="Mariann Rosa" src="sites/default/files/styles/square_thumbnail/public/field/image/mariann.jpg"> </a></li> <li id="work-list-52"><a data-page="52" href="#work-list-52"> <img width="230" height="230" alt="Mariann Rosa" src="sites/default/files/styles/square_thumbnail/public/field/image/mariann.jpg"> </a></li> <li id="work-list-53"><a data-page="53" href="#work-list-53"> <img width="230" height="230" alt="Mariann Rosa" src="sites/default/files/styles/square_thumbnail/public/field/image/mariann.jpg"> </a></li> </ul> I have come this far: $(document).ready(function(){ $("#work-list a").click(function(event){ event.preventDefault(); $('html, body').animate ( {scrollTop: $('#top').offset().top}, 800 ); }); $('#work-list a').click(function(e) { $('#work-container > div').hide(); $(this.hash).slideToggle(1600); }); }); It scrolls to top and the div becomes visible but it does not work correctly :)

    Read the article

  • KnockoutJS showing a sorted list by item category

    - by Darksbane
    I just started learning knockout this week and everything has gone well except for this one issue. I have a list of items that I sort multiple ways but one of the ways I want to sort needs to have a different display than the standard list. As an example lets say I have this code var BetterListModel = function () { var self = this; food = [ { "name":"Apple", "quantity":"3", "category":"Fruit", "cost":"$1", },{ "name":"Ice Cream", "quantity":"1", "category":"Dairy", "cost":"$6", },{ "name":"Pear", "quantity":"2", "category":"Fruit", "cost":"$2", },{ "name":"Beef", "quantity":"1", "category":"Meat", "cost":"$3", },{ "name":"Milk", "quantity":"5", "category":"Dairy", "cost":"$4", }]; self.allItems = ko.observableArray(food); // Initial items // Initial sort self.sortMe = ko.observable("name"); ko.utils.compareItems = function (l, r) { if (self.sortMe() =="cost"){ return l.cost > r.cost ? 1 : -1 } else if (self.sortMe() =="category"){ return l.category > r.category ? 1 : -1 } else if (self.sortMe() =="quantity"){ return l.quantity > r.quantity ? 1 : -1 }else { return l.name > r.name ? 1 : -1 } }; }; ko.applyBindings(new BetterListModel()); and the HTML <p>Your values:</p> <ul class="deckContents" data-bind="foreach:allItems().sort(ko.utils.compareItems)"> <li><div style="width:100%"><div class="left" style="width:30px" data-bind="text:quantity"></div><div class="left fixedWidth" data-bind="text:name"></div> <div class="left fixedWidth" data-bind="text:cost"></div> <div class="left fixedWidth" data-bind="text:category"></div><div style="clear:both"></div></div></li> </ul> <select data-bind="value:sortMe"> <option selected="selected" value="name">Name</option> <option value="cost">Cost</option> <option value="category">Category</option> <option value="quantity">Quantity</option> </select> </div> So I can sort these just fine by any field I might sort them by name and it will display something like this 3 Apple $1 Fruit 1 Beef $3 Meat 1 Ice Cream $6 Dairy 5 Milk $4 Dairy 2 Pear $2 Fruit Here is a fiddle of what I have so far http://jsfiddle.net/Darksbane/X7KvB/ This display is fine for all the sorts except the category sort. What I want is when I sort them by category to display it like this Fruit 3 Apple $1 Fruit 2 Pear $2 Fruit Meat 1 Beef $3 Meat Dairy 1 Ice Cream $6 Dairy 5 Milk $4 Dairy Does anyone have any idea how I might be able to display this so differently for that one sort?

    Read the article

  • asp.net Web server control with child controls, event not firing

    - by bleeeah
    I have a simple web control (TaskList) that can have children (Task) which inherit from LinkButton, that can be added declaratively or programatically. This works ok, but I can't get the onclick event of a Task to be fired in my code behind. The code .. [ToolboxData("<{0}:TaskList runat=\"server\"> </{0}:TaskList>")] [ParseChildren(true)] [PersistChildren(false)] public class TaskList : System.Web.UI.Control { //[DefaultProperty("Text")] public TaskList() {} private List<Task> _taskList = new List<Task>(); private string _taskHeading = ""; public string Heading { get { return this._taskHeading; } set { this._taskHeading = value; } } [NotifyParentProperty(true)] [PersistenceMode(PersistenceMode.InnerProperty)] [DesignerSerializationVisibility(DesignerSerializationVisibility.Content)] public List<Task> Tasks { get { return this._taskList; } set { this._taskList = value; } } protected override void CreateChildControls() { foreach (Task task in this._taskList) this.Controls.Add(task); base.CreateChildControls(); } protected override void Render(HtmlTextWriter writer) { writer.Write("<h2>" + this._taskHeading + "</h2>"); writer.Write("<div class='tasks_container'>"); writer.Write("<div class='tasks_list'>"); writer.Write("<ul>"); foreach (Task task in this._taskList) { writer.Write("<li>"); task.RenderControl(writer); writer.Write("</li>"); } writer.Write("</ul>"); writer.Write("</div>"); writer.Write("</div>"); } } public class Task : LinkButton { private string _key = ""; public string Key { get { return this._key; } set { this._key = value; } } } Markup: <rf:TaskList runat="server" ID="tskList" Heading="Tasks"> <Tasks> <rf:Task Key="ba" ID="L1" Text="Helllo" OnClick="task1_Click" runat="server" /> </Tasks> </rf:TaskList> The Onclick event task1_Click never fires when clicked (although a postback occurs).

    Read the article

  • .NET Extension Objects with XSLT -- how to iterate over a collection?

    - by Pandincus
    Help me, Stackoverflow! I have a simple .NET 3.5 console app that reads some data and sends emails. I'm representing the email format in an XSLT stylesheet so that we can easily change the wording of the email without needing to recompile the app. We're using Extension Objects to pass data to the XSLT when we apply the transformation: <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:msxsl="urn:schemas-microsoft-com:xslt" exclude-result-prefixes="msxsl" xmlns:EmailNotification="ext:EmailNotification"> -- this way, we can have statements like: <p> Dear <xsl:value-of select="EmailNotification:get_FullName()" />: </p> The above works fine. I pass the object via code like this (some irrelevant code omitted for brevity): // purely an example structure public struct EmailNotification { public string FullName { get; set; } } // Somewhere in some method ... var notification = new Notification("John Smith"); // ... XsltArgumentList xslArgs = new XsltArgumentList(); xslArgs.AddExtensionObject("ext:EmailNotification", notification); // ... // The part where it breaks! (This is where we do the transformation) xslt.Transform(fakeXMLDocument.CreateNavigator(), xslArgs, XmlWriter.Create(transformedXMLString)); So, all of the above code works. However, I wanted to get a little fancy (always my downfall) and pass a collection, so that I could do something like this: <p>The following accounts need to be verified:</p> <xsl:for-each select="EmailNotification:get_SomeCollection()"> <ul> <li> <xsl:value-of select="@SomeAttribute" /> </li> </ul> <xsl:for-each> When I pass the collection in the extension object and attempt to transform, I get the following error: "Extension function parameters or return values which have Clr type 'String[]' are not supported." or List, or IEnumerable, or whatever I try to pass in. So, my questions are: How can I pass in a collection to my XSLT? What do I put for the xsl:value-of select="" inside the xsl:for-each ? Is what I am trying to do impossible?

    Read the article

  • expand div with focus-jquery

    - by Joel
    Hi guys, I'm revisiting this after a few weeks, because I could never get it to work before, and hoping to now. Please look at this website-notice the newsletter signup form at the top right. http://www.rattletree.com I am wanting it to look exactly this way for now, but when the user clicks in the box to enter their email address, the containing div will expand (or simply appear) above the email field to also include a "name" and "city" field. I'm using jquery liberally in the sight, so that is at my disposal. This form is in the header so any id info, etc can't be withing the body tag... This is what I have so far: <div class="outeremailcontainer"> <div id="emailcontainer"> <?php include('verify.php'); ?> <form action="index_success.php" method="post" id="sendEmail" class="email"> <h3 class="register2">Newsletter Signup:</h3> <ul class="forms email"> <li class="email"><label for="emailFrom">Email: </label> <input type="text" name="emailFrom" class="info" id="emailFrom" value="<?= $_POST['emailFrom']; ?>" /> <?php if(isset($emailFromError)) echo '<span class="error">'.$emailFromError.'</span>'; ?> </li> <li class="buttons email"> <button type="submit" id="submit">Send</button> <input type="hidden" name="submitted" id="submitted" value="true" /> </li> </ul> </form> <div class="clearing"> </div> </div> css: p.emailbox{ text-align:center; margin:0; } p.emailbox:first-letter { font-size: 120%; font-weight: bold; } .outeremailcontainer { height:60px; width: 275px; background-image:url(/images/feather_email2.jpg); /*background-color:#fff;*/ text-align:center; /* margin:-50px 281px 0 auto ; */ float:right; position:relative; z-index:1; } form.email{ position:relative; } #emailcontainer { margin:0; padding: 0 auto; z-index:1000; display:block; position:relative; } Thanks for any help! Joel

    Read the article

< Previous Page | 62 63 64 65 66 67 68 69 70 71 72 73  | Next Page >