Search Results

Search found 807 results on 33 pages for 'fn virtualfilestats'.

Page 32/33 | < Previous Page | 28 29 30 31 32 33  | Next Page >

  • Why doesn't PHP's oci_connect return false?

    - by absolethe
    I have a situation in which we have two production databases that synchronize with one other. Server One is considered the primary. Sometimes due to maintenance or a disaster Server Two will become primary. In some of our code that means we have to manually go in and edit the server name for database connections. I find this annoying, so the last thing I wrote I put the server information for both and set up a loop. If oci_connect failed on the Server One 3 times it would move on to Server Two. If Server Two failed 3 times it would notify the user a connection couldn't be made. This has worked fine most times we've had the situation of switching the servers. Yesterday, for example, it worked fine. Today it didn't. It just sat and spun endlessly. No error in the PHP error log. No failure to move on from. No error output to the screen. Nothing for 5 minutes. So then I had to manually edit the stupid config file. I asked what could possibly be different and I was told "yesterday the database was down, but not the server. today the server is down." Okay...? But I don't see a distinction. I would expect oci_connect to return false if it can't establish any sort of communication with the server. I'd expect it to timeout and error. Not just pass it on when it receives an error code from the server. What if there's a network problem, for example? Is this a bug in oci_connect or is there a possibility that something in our PHP configuration gives oci_connect a crazily long timeout? If it is a sort of "bug" is there some way I can check to see if the server is up first? Like a ping? (Of course when I did a ping through the command prompt I got a response from Server One and then was told, "it's back now" although I am skeptical about the timing on that.) Anyway, if anyone could shed some light on why oci_connect might run endlessly without failing and how to keep it from doing so I'd be grateful. -- Edit: My code looks like the examples on PHP.net only in some loops. $count = count($servers); for($i = 0; $i < $count; $i++){ if((!isset($connection)) || ($connection == false)){ // Attempt to connect to the oracle database $connection = @oci_connect($servers[$i]["user"], $servers[$i]["pass"], $servers[$i]["conid"]) or ($conn_error = oracle_error()); // Try again if there was a failure if(($connection == false) || (isset($con_error))){ // Three (two more) tries per alternative for($j = $st; $j < $fn; $j++){ // Try again to connect $connection = @oci_connect($servers[$i]["user"], $servers[$i]["pass"], $servers[$i]["conid"]) or ($conn_error = oracle_error()); } // for($j = 2; $j < 4; $j++) } // if($connection == false) } // if(!isset($connection) || ($connection == false)) } // for($i = 0; $i < $count; $i++)

    Read the article

  • jQuery code not working in Google Chrome...

    - by Jonathan
    Hi, I have writen a simple jQuery code to control ajax tabs navigation.. Its working in good on FireFox but in Chrome it working in one page but not in the home page I don't know why... Its really simple code just a lot of animations and callbacks and stuff like that.. here's the code: jQuery.fn.tabs = function({movieID, movieTitle}) { var tabsWrap = '#movie_details_wrap'; var tabsContent = '#tab_content'; var firstTab = '#tab_detalles'; var postPHP = 'index.php?controlador=pelicula'; //When page loads... first tab actions $('ul.tabs_nav a:first').addClass('active'); //Activate first tab nav $.get(postPHP, {"activeTab": firstTab, "movieID": movieID}, function(response){ $(tabsContent).html(response); // insert response into the faded out div $(tabsWrap).animate({ // animate the wrap div using the new container div height height: $(tabsContent).height() + "px" }, function() { $(tabsContent).fadeIn(); // fade in the div with all the info }); }); //On Click Event $('ul.tabs_nav li').click(function() { $('ul.tabs_nav a').removeClass('active'); //Remove any 'active' class $(this).find('a').addClass('active'); //Add 'active' class to selected tab var activeTab = $(this).find('a').attr('href'); //Find the href attribute value to identify the active tab + content var orgHeight = $(tabsContent).height() + 'px'; // get original height $(tabsWrap).css('height', orgHeight); // set height with css to freeze the wrap div when we hide the inner div $(tabsContent).fadeOut(200, function() { // fade out the inner div // send data by ajax (post) $.get(postPHP, {"activeTab": activeTab, "movieID": movieID , "movieTitle": movieTitle}, function(response){ $(tabsContent).html(response); // insert response into the faded out div $(tabsWrap).animate({ // animate the wrap div using the new container div height height: $(tabsContent).height() + "px" }, function() { $(tabsContent).fadeIn(); // fade in the div with all the info }); }); }); return false; }); }; Here's the HTML: <script type="text/javascript"> $(document).ready(function(){ $('.tabs_nav').tabs({movieID:'135353', movieTitle: 'Some Title'}); }); </script> <!--Navigation--> <ul id="details_nav" class="tabs_nav"> <li><a href="#tab_detalles">Detalles</a></li> <li><a href="#tab_criticas">Criticas</a></li> <li><a href="#tab_posters">Posters</a></li> <li><a href="#tab_trailers">Trailers</a></li> </ul> <div class="border_wrap"> <div id="movie_details_wrap"> <div id="tab_content"> <!--Tabs content here--> </div> </div> </div>

    Read the article

  • Building a jQuery Plug-in to make an HTML Table scrollable

    - by Rick Strahl
    Today I got a call from a customer and we were looking over an older application that uses a lot of tables to display financial and other assorted data. The application is mostly meta-data driven with lots of layout formatting automatically driven through meta data rather than through explicit hand coded HTML layouts. One of the problems in this apps are tables that display a non-fixed amount of data. The users of this app don't want to use paging to see more data, but instead want to display overflow data using a scrollbar. Many of the forms are very densely populated, often with multiple data tables that display a few rows of data in the UI at the most. This sort of layout does not lend itself well to paging, but works much better with scrollable data. Unfortunately scrollable tables are not easily created. HTML Tables are mangy beasts as anybody who's done any sort of Web development knows. Tables are finicky when it comes to styling and layout, and they have many funky quirks, especially when it comes to scrolling both of the table rows themselves or even the child columns. There's no built-in way to make tables scroll and to lock headers while you do, and while you can embed a table (or anything really) into a scrolling div with something like this: <div style="position:relative; overflow: hidden; overflow-y: scroll; height: 200px; width: 400px;"> <table id="table" style="width: 100%" class="blackborder" > <thead> <tr class="gridheader"> <th>Column 1</th> <th>Column 2</th> <th>Column 3</th> <th >Column 4</th> </tr> </thead> <tbody> <tr> <td>Column 1 Content</td> <td>Column 2 Content</td> <td>Column 3 Content</td> <td>Column 4 Content</td> </tr> <tr> <td>Column 1 Content</td> <td>Column 2 Content</td> <td>Column 3 Content</td> <td>Column 4 Content</td> </tr> … </tbody> </table> </div> </div> that won't give a very satisfying visual experience: Both the header and body scroll which looks odd. You lose context as soon as the header scrolls off the top and when you reach the bottom of the list the bottom outline of the table shows which also looks off. The the side bar shows all the way down the length of the table yet another visual miscue. In a pinch this will work, but it's ugly. What's out there? Before we go further here you should know that there are a few capable grid plug-ins out there already. Among them: Flexigrid (can work of any table as well as with AJAX data) jQuery Scrollable Table Plug-in (feature similar to what I need but not quite) jqGrid (mostly an Ajax Grid which is very powerful and works very well) But in the end none of them fit the bill of what I needed in this situation. All of these require custom CSS and some of them are fairly complex to restyle. Others are AJAX only or work better with AJAX loaded data. However, I need to actually try (as much as possible) to maintain the original styling of the tables without requiring extensive re-styling. Building the makeTableScrollable() Plug-in To make a table scrollable requires rearranging the table a bit. In the plug-in I built I create two <div> tags and split the table into two: one for the table header and one for the table body. The bottom <div> tag then contains only the table's row data and can be scrolled while the header stays fixed. Using jQuery the basic idea is pretty simple: You create the divs, copy the original table into the bottom, then clone the table, clear all content append the <thead> section, into new table and then copy that table into the second header <div>. Easy as pie, right? Unfortunately it's a bit more complicated than that as it's tricky to get the width of the table right to account for the scrollbar (by adding a small column) and making sure the borders properly line up for the two tables. A lot of style settings have to be made to ensure the table is a fixed size, to remove and reattach borders, to add extra space to allow for the scrollbar and so forth. The end result of my plug-in is a table with a scrollbar. Using the same table I used earlier the result looks like this: To create it, I use the following jQuery plug-in logic to select my table and run the makeTableScrollable() plug-in against the selector: $("#table").makeTableScrollable( { cssClass:"blackborder"} ); Without much further ado, here's the short code for the plug-in: (function ($) { $.fn.makeTableScrollable = function (options) { return this.each(function () { var $table = $(this); var opt = { // height of the table height: "250px", // right padding added to support the scrollbar rightPadding: "10px", // cssclass used for the wrapper div cssClass: "" } $.extend(opt, options); var $thead = $table.find("thead"); var $ths = $thead.find("th"); var id = $table.attr("id"); var cssClass = $table.attr("class"); if (!id) id = "_table_" + new Date().getMilliseconds().ToString(); $table.width("+=" + opt.rightPadding); $table.css("border-width", 0); // add a column to all rows of the table var first = true; $table.find("tr").each(function () { var row = $(this); if (first) { row.append($("<th>").width(opt.rightPadding)); first = false; } else row.append($("<td>").width(opt.rightPadding)); }); // force full sizing on each of the th elemnts $ths.each(function () { var $th = $(this); $th.css("width", $th.width()); }); // Create the table wrapper div var $tblDiv = $("<div>").css({ position: "relative", overflow: "hidden", overflowY: "scroll" }) .addClass(opt.cssClass); var width = $table.width(); $tblDiv.width(width).height(opt.height) .attr("id", id + "_wrapper") .css("border-top", "none"); // Insert before $tblDiv $tblDiv.insertBefore($table); // then move the table into it $table.appendTo($tblDiv); // Clone the div for header var $hdDiv = $tblDiv.clone(); $hdDiv.empty(); var width = $table.width(); $hdDiv.attr("style", "") .css("border-bottom", "none") .width(width) .attr("id", id + "_wrapper_header"); // create a copy of the table and remove all children var $newTable = $($table).clone(); $newTable.empty() .attr("id", $table.attr("id") + "_header"); $thead.appendTo($newTable); $hdDiv.insertBefore($tblDiv); $newTable.appendTo($hdDiv); $table.css("border-width", 0); }); } })(jQuery); Oh sweet spaghetti code :-) The code starts out by dealing the parameters that can be passed in the options object map: height The height of the full table/structure. The height of the outside wrapper container. Defaults to 200px. rightPadding The padding that is added to the right of the table to account for the scrollbar. Creates a column of this width and injects it into the table. If too small the rightmost column might get truncated. if too large the empty column might show. cssClass The CSS class of the wrapping container that appears to wrap the table. If you want a border around your table this class should probably provide it since the plug-in removes the table border. The rest of the code is obtuse, but pretty straight forward. It starts by creating a new column in the table to accommodate the width of the scrollbar and avoid clipping of text in the rightmost column. The width of the columns is explicitly set in the header elements to force the size of the table to be fixed and to provide the same sizing when the THEAD section is moved to a new copied table later. The table wrapper div is created, formatted and the table is moved into it. The new wrapper div is cloned for the header wrapper and configured. Finally the actual table is cloned and cleared of all elements. The original table's THEAD section is then moved into the new table. At last the new table is added to the header <div>, and the header <div> is inserted before the table wrapper <div>. I'm always amazed how easy jQuery makes it to do this sort of re-arranging, and given of what's happening the amount of code is rather small. Disclaimer: Your mileage may vary A word of warning: I make no guarantees about the code above. It's a first cut and I provided this here mainly to demonstrate the concepts of decomposing and reassembling an HTML layout :-) which jQuery makes so nice and easy. I tested this component against the typical scenarios we plan on using it for which are tables that use a few well known styles (or no styling at all). I suspect if you have complex styling on your <table> tag that things might not go so well. If you plan on using this plug-in you might want to minimize your styling of the table tag and defer any border formatting using the class passed in via the cssClass parameter, which ends up on the two wrapper div's that wrap the header and body rows. There's also no explicit support for footers. I rarely if ever use footers (when not using paging that is), so I didn't feel the need to add footer support. However, if you need that it's not difficult to add - the logic is the same as adding the header. The plug-in relies on a well-formatted table that has THEAD and TBODY sections along with TH tags in the header. Note that ASP.NET WebForm DataGrids and GridViews by default do not generate well-formatted table HTML. You can look at my Adding proper THEAD sections to a GridView post for more info on how to get a GridView to render properly. The plug-in has no dependencies other than jQuery. Even with the limitations in mind I hope this might be useful to some of you. I know I've already identified a number of places in my own existing applications where I will be plugging this in almost immediately. Resources Download Sample and Plug-in code Latest version in the West Wind Web & AJAX Toolkit Repository © Rick Strahl, West Wind Technologies, 2005-2011Posted in jQuery  HTML  ASP.NET  

    Read the article

  • jquery dynamic form plugin: adding nested field support

    - by goliatone
    Hi, Im using the jQuery dynamic form plugin, but i need support for nested field duplication. I would like some advice on how to modify the plugin to add such functionality. Im not a javascript/jQuery developer, so any advice on which route to take will be much appreciated. I can provide the plugin's code: /** * @author Stephane Roucheray * @extends jQuery */ jQuery.fn.dynamicForm = function (plusElmnt, minusElmnt, options){ var source = jQuery(this), minus = jQuery(minusElmnt), plus = jQuery(plusElmnt), template = source.clone(true), fieldId = 0, formFields = "input, checkbox, select, textarea", insertBefore = source.next(), clones = [], defaults = { duration:1000 }; // Extend default options with those provided options = $.extend(defaults, options); isPlusDescendentOfTemplate = source.find("*").filter(function(){ return this == plus.get(0); }); isPlusDescendentOfTemplate = isPlusDescendentOfTemplate.length > 0 ? true : false; function normalizeElmnt(elmnt){ elmnt.find(formFields).each(function(){ var nameAttr = jQuery(this).attr("name"), idAttr = jQuery(this).attr("id"); /* Normalize field name attributes */ if (!nameAttr) { jQuery(this).attr("name", "field" + fieldId + "[]"); } if (!/\[\]$/.exec(nameAttr)) { jQuery(this).attr("name", nameAttr + "[]"); } /* Normalize field id attributes */ if (idAttr) { /* Normalize attached label */ jQuery("label[for='"+idAttr+"']").each(function(){ jQuery(this).attr("for", idAttr + fieldId); }); jQuery(this).attr("id", idAttr + fieldId); } fieldId++; }); }; /* Hide minus element */ minus.hide(); /* If plus element is within the template */ if (isPlusDescendentOfTemplate) { function clickOnPlus(event){ var clone, currentClone = clones[clones.length -1] || source; event.preventDefault(); /* On first add, normalize source */ if (clones.length == 0) { normalizeElmnt(source); currentClone.find(minusElmnt).hide(); currentClone.find(plusElmnt).hide(); }else{ currentClone.find(plusElmnt).hide(); } /* Clone template and normalize it */ clone = template.clone(true).insertAfter(clones[clones.length - 1] || source); normalizeElmnt(clone); /* Normalize template id attribute */ if (clone.attr("id")) { clone.attr("id", clone.attr("id") + clones.length); } plus = clone.find(plusElmnt); minus = clone.find(minusElmnt); minus.get(0).removableClone = clone; minus.click(clickOnMinus); plus.click(clickOnPlus); if (options.limit && (options.limit - 2) > clones.length) { plus.show(); }else{ plus.hide(); } clones.push(clone); } function clickOnMinus(event){ event.preventDefault(); if (this.removableClone.effect && options.removeColor) { that = this; this.removableClone.effect("highlight", { color: options.removeColor }, options.duration, function(){that.removableClone.remove();}); } else { this.removableClone.remove(); } clones.splice(clones.indexOf(this.removableClone),1); if (clones.length == 0){ source.find(plusElmnt).show(); }else{ clones[clones.length -1].find(plusElmnt).show(); } } /* Handle click on plus */ plus.click(clickOnPlus); /* Handle click on minus */ minus.click(function(event){ }); }else{ /* If plus element is out of the template */ /* Handle click on plus */ plus.click(function(event){ var clone; event.preventDefault(); /* On first add, normalize source */ if (clones.length == 0) { normalizeElmnt(source); jQuery(minusElmnt).show(); } /* Clone template and normalize it */ clone = template.clone(true).insertAfter(clones[clones.length - 1] || source); if (clone.effect && options.createColor) { clone.effect("highlight", {color:options.createColor}, options.duration); } normalizeElmnt(clone); /* Normalize template id attribute */ if (clone.attr("id")) { clone.attr("id", clone.attr("id") + clones.length); } if (options.limit && (options.limit - 3) < clones.length) { plus.hide(); } clones.push(clone); }); /* Handle click on minus */ minus.click(function(event){ event.preventDefault(); var clone = clones.pop(); if (clones.length >= 0) { if (clone.effect && options.removeColor) { that = this; clone.effect("highlight", { color: options.removeColor, mode:"hide" }, options.duration, function(){clone.remove();}); } else { clone.remove(); } } if (clones.length == 0) { jQuery(minusElmnt).hide(); } plus.show(); }); } };

    Read the article

  • Optimizing a 3D World Javascript Animation

    - by johnny
    Hi! I've recently come up with the idea to create a tag cloud like animation shaped like the earth. I've extracted the coastline coordinates from ngdc.noaa.gov and wrote a little script that displayed it in my browser. Now as you can imagine, the whole coastline consists of about 48919 points, which my script would individually render (each coordinate being represented by one span). Obviously no browser is capable of rendering this fluently - but it would be nice if I could render as much as let's say 200 spans (twice as much as now) on my old p4 2.8 Ghz (as a representative benchmark). Are there any javascript optimizations I could use in order to speed up the display of those spans? One 'coordinate': <div id="world_pixels"> <span id="wp_0" style="position:fixed; top:0px; left:0px; z-index:1; font-size:20px; cursor:pointer;cursor:hand;" onmouseover="magnify_world_pixel('wp_0');" onmouseout="shrink_world_pixel('wp_0');" onClick="set_askcue_bar('', 'new york')">new york</span> </div> The script: $(document).ready(function(){ world_pixels = $("#world_pixels span"); world_pixels.spin(); setInterval("world_pixels.spin()",1500); }); z = new Array(); $.fn.spin = function () { for(i=0; i<this.length; i++) { /*actual screen coordinates: x/y/z --> left/font-size/top 300/13/0 300/6/300 | / |/ 0/13/300 ----|---- 600/13/300 /| / | 300/20/300 300/13/600 */ /*scale font size*/ var resize_x = 1; /*scale width*/ var resize_y = 2.5; /*scale height*/ var resize_z = 2.5; var from_left = 300; var from_top = 20; /*actual math coordinates: 1 -1 | / |/ 1 ----|---- -1 /| / | 1 -1 */ //var get_element = document.getElementById(); //var font_size = parseInt(this.style.fontSize); var font_size = parseInt($(this[i]).css("font-size")); var left = parseInt($(this[i]).css("left")); if (coast_line_array[i][1]) { } else { var top = parseInt($(this[i]).css("top")); z[i] = from_top + (top - (300 * resize_z)) / (300 * resize_z); //global beacause it's used in other functions later on var top_new = from_top + Math.round(Math.cos(coast_line_array[i][2]/90*Math.PI) * (300 * resize_z) + (300 * resize_z)); $(this[i]).css("top", top_new); coast_line_array[i][3] = 1; } var x = resize_x * (font_size - 13) / 7; var y = from_left + (left- (300 * resize_y)) / (300 * resize_y); if (y >= 0) { this[i].phi = Math.acos(x/(Math.sqrt(x^2 + y^2))); } else { this[i].phi = 2*Math.PI - Math.acos(x/(Math.sqrt(x^2 + y^2))); i } this[i].theta = Math.acos(z[i]/Math.sqrt(x^2 + y^2 + z[i]^2)); var font_size_new = resize_x * Math.round(Math.sin(coast_line_array[i][4]/90*Math.PI) * Math.cos(coast_line_array[i][0]/180*Math.PI) * 7 + 13); var left_new = from_left + Math.round(Math.sin(coast_line_array[i][5]/90*Math.PI) * Math.sin(coast_line_array[i][0]/180*Math.PI) * (300 * resize_y) + (300 * resize_y)); //coast_line_array[i][6] = coast_line_array[i][7]+1; if ((coast_line_array[i][0] + 1) > 180) { coast_line_array[i][0] = -180; } else { coast_line_array[i][0] = coast_line_array[i][0] + 0.25; } $(this[i]).css("font-size", font_size_new); $(this[i]).css("left", left_new); } } resize_x = 1; function magnify_world_pixel(element) { $("#"+element).animate({ fontSize: resize_x*30+"px" }, { duration: 1000 }); } function shrink_world_pixel(element) { $("#"+element).animate({ fontSize: resize_x*6+"px" }, { duration: 1000 }); } I'd appreciate any suggestions to optimize my script, maybe there is even a totally different approach on how to go about this. The whole .js file which stores the array for all the coordinates is available on my page, the file is about 2.9 mb, so you might consider pulling the .zip for local testing: metaroulette.com/files/31218.zip metaroulette.com/files/31218.js P.S. the php I use to create the spans: <?php //$arbitrary_characters = array('a','b','c','ddsfsdfsdf','e','f','g','h','isdfsdffd','j','k','l','mfdgcvbcvbs','n','o','p','q','r','s','t','uasdfsdf','v','w','x','y','z','0','1','2','3','4','5','6','7','8','9',); $arbitrary_characters = array('cat','table','cool','deloitte','askcue','what','more','less','adjective','nice','clinton','mars','jupiter','testversion','beta','hilarious','lolcatz','funny','obama','president','nice','what','misplaced','category','people','religion','global','skyscraper','new york','dubai','helsinki','volcano','iceland','peter','telephone','internet', 'dialer', 'cord', 'movie', 'party', 'chris', 'guitar', 'bentley', 'ford', 'ferrari', 'etc', 'de facto'); for ($i=0; $i<96; $i++) { $arb_digits = rand (0,45); $arbitrary_character = $arbitrary_characters[$arb_digits]; //$arbitrary_character = "."; echo "<span id=\"wp_$i\" style=\"position:fixed; top:0px; left:0px; z-index:1; font-size:20px; cursor:pointer;cursor:hand;\" onmouseover=\"magnify_world_pixel('wp_$i');\" onmouseout=\"shrink_world_pixel('wp_$i');\" onClick=\"set_askcue_bar('', '$arbitrary_character')\">$arbitrary_character</span>\n"; } ?>

    Read the article

  • Sliding a div across to left and the next div appears

    - by littleMan
    I have this form Im creating and when you click on the "Next" button I want to slide the next form() across to the left this is my function jQuery('input[name^=Next]').click(function () { current.animate({ marginLeft: -current.width() }, 750); current = current.next(); }); That function isn't working the way I want to. it slides the text in the container across not the whole container it could be a css problem for all I know. And my form which has a class name .wikiform doesn't center horizontally. here is my full code. I'm not that experience in javascript so you would be appreciated. cut and paste and try it out <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" /> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <script type="text/javascript" language="javascript" src="Scripts/jquery-1.4.4.js"></script> <script type="text/javascript" language="javascript" src="Scripts/jquery-easing.1.2.pack.js"></script> <script type="text/javascript" language="javascript"> (function ($) { $.fn.WikiForm = function (options) { this.Mode = options.mode || 'CancelOk' || 'Ok' || 'Wizard'; var current = jQuery('.wikiform .view :first'); function positionForm() { //jQuery('.wikiform').css( {'top': jQuery('body') .css('overflow-y', 'hidden'); jQuery('<div id="overlay"></div>') .insertBefore('.wikiform') .css('top', jQuery(document).scrollTop()) .animate({ 'opacity': '0.8' }, 'slow'); jQuery('.wikiform') .css('height', jQuery('.wikiform .wizard .view:first').height() + jQuery('.wikiform .navigation').height()) .css('top', window.screen.availHeight / 2 - jQuery('.wikiform').height() / 2) .css('width', jQuery('.wikiform .wizard .view:first').width()) .css('left', -jQuery('.wikiform').width()) .animate({ marginLeft: jQuery(document).width() / 2 + jQuery('.wikiform').width() / 2 }, 750); jQuery('.wikiform .wizard') .css('overflow', 'hidden') .css('height', jQuery('.wikiform .wizard .view:first').height() ); } if (this.Mode == "Wizard") { return this.each(function () { var current = jQuery('.wizard .view :first'); var form = jQuery(this); positionForm(); jQuery('input[name^=Next]').click(function () { current.animate({ marginLeft: -current.width() }, 750); current = current.next(); }); jQuery('input[name^=Back]').click(function () { alert("Back"); }); }); } else if (this.Mode == "CancelOk") { return this.each(function () { }); } else { return this.each(function () { }); } }; })(jQuery); $(document).ready(function () { jQuery(window).bind("load", function () { jQuery(".wikiform").WikiForm({ mode: 'Wizard', speed:750, ease:"expoinout" }); }); }); </script> <style type="text/css"> body { margin:0px; } #overlay { background-color:Black; position:absolute; top:0; left:0; height:100%; width:100%; } .wikiform { background-color:Green; position:absolute; } .wikiform .wizard { clear: both; } .wizard { position: relative; left: 0; top: 0; width: 100%; list-style-type: none; } .wizard .view { float:left; } .view .form { } .navigation { float:right; clear:left } #view1 { background-color:Aqua; width:300px; height:300px; } #view2 { background-color:Fuchsia; width:300px; height:300px; } </style> <title></title> </head> <body><form action="" method=""><div id="layout"> <div id="header"> Header </div> <div id="content" style="height:2000px"> Content </div> <div id="footer"> Footer </div> </div> <div id="formView1" class="wikiform"> <div class="wizard"> <div id="view1" class="view"> <div class="form"> Content 1 </div> </div> <div id="view2" class="view"> <div class="form"> Content 2 </div> </div> </div> <div class="navigation"> <input type="button" name="Back" value=" Back " /> <input type="button" name="Next " class="Next" value=" Next " /> <input type="button" name="Cancel" value="Cancel" /> </div> </div></form></body></html>

    Read the article

  • datatables-multi-filter-select

    - by user1871603
    I am using the jquery plug-in datatables. I am using the feature, datatables-multi-filter-select on my website with php code. I want to move the drop down filter from the footer to the header like in the following example: http://www.datatables.net/extras/thirdparty/ColumnFilterWidgets/DataTables/extras/ColumnFilterWidgets/ Can anyone please update the following PHP code sample to accomplish this? Code: /** * Register necessary Plugin Filters */add_filter( 'tablepress_shortcode_table_default_shortcode_atts', 'tablepress_add_shortcode_parameters_multi_filter_select' );add_filter( 'tablepress_table_render_options', 'tablepress_set_table_foot_option', 10, 2 );add_filter( 'tablepress_table_js_options', 'tablepress_add_multi_filter_select_js_options', 10, 3 );add_filter( 'tablepress_datatables_command', 'tablepress_add_multi_filter_select_js_command', 10, 5 ); /** * Add "datatables_multi_filter_select" as a valid parameter to the [table /] Shortcode */function tablepress_add_shortcode_parameters_multi_filter_select( $default_atts ) { $default_atts['datatables_multi_filter_select'] = false; return $default_atts;} /** * Make sure that "table_foot" and "datatables_scrollX" are false, if "datatables_multi_filter_select" is true, * as the footer will be appended by the JS. Scrolling will not work with automatically added content */function tablepress_set_table_foot_option( $render_options, $table ) { if ( $render_options['datatables_multi_filter_select'] ) { $render_options['table_foot'] = false; $render_options['datatables_scrollX'] = false; } return $render_options;} /** * Pass "datatables_multi_filter_select" from Shortcode parameters to JavaScript arguments */function tablepress_add_multi_filter_select_js_options( $js_options, $table_id, $render_options ) { $js_options['datatables_multi_filter_select'] = $render_options['datatables_multi_filter_select']; // register the JS if ( $js_options['datatables_multi_filter_select'] ) { $suffix = ( defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ) ? '' : '.min'; $js_multi_filter_select_url = plugins_url( "multi-filter-select{$suffix}.js", __FILE__ ); wp_enqueue_script( 'tablepress-multi_filter_select', $js_multi_filter_select_url, array( 'tablepress-datatables' ), '1.0', true ); } return $js_options;} /** * Evaluate "datatables_multi_filter_select" parameter and add corresponding JavaScript code, if needed */function tablepress_add_multi_filter_select_js_command( $command, $html_id, $parameters, $table_id, $js_options ) { if ( ! $js_options['datatables_multi_filter_select'] ) return $command; $name = str_replace( '-', '_', $html_id ); $datatables_name = "DT_{$name}"; $command = <<<JSvar {$name} = $('#{$html_id}'), {$datatables_name} = {$name}.dataTable({$parameters}), {$name}_tfoot, {$name}_selects, ths = '<tfoot>';{$name}.find('thead th').each( function( i ) { ths += '<th>' + datatables_fnCreateSelect( {$datatables_name}.fnGetColumnData(i) ) + '</th>';} );ths += '</tfoot>';{$name}_tfoot = {$name}.append(ths).find('tfoot');{$name}_selects = {$name}_tfoot.find('select');{$name}_tfoot.on( 'change', 'select', function() { {$datatables_name}.fnFilter( $(this).val(), {$name}_selects.index(this) );} );JS; return $command;} (function($) {/* * Function: fnGetColumnData * Purpose: Return an array of table values from a particular column. * Returns: array string: 1d data array * Inputs: object:oSettings - dataTable settings object. This is always the last argument past to the function * int:iColumn - the id of the column to extract the data from * bool:bUnique - optional - if set to false duplicated values are not filtered out * bool:bFiltered - optional - if set to false all the table data is used (not only the filtered) * bool:bIgnoreEmpty - optional - if set to false empty values are not filtered from the result array * Author: Benedikt Forchhammer <b.forchhammer /AT\ mind2.de> */$.fn.dataTableExt.oApi.fnGetColumnData = function ( oSettings, iColumn, bUnique, bFiltered, bIgnoreEmpty ) { // check that we have a column id if ( typeof iColumn == "undefined" ) return new Array(); // by default we only wany unique data if ( typeof bUnique == "undefined" ) bUnique = true; // by default we do want to only look at filtered data if ( typeof bFiltered == "undefined" ) bFiltered = true; // by default we do not wany to include empty values if ( typeof bIgnoreEmpty == "undefined" ) bIgnoreEmpty = true; // list of rows which we're going to loop through var aiRows; // use only filtered rows if (bFiltered == true) aiRows = oSettings.aiDisplay; // use all rows else aiRows = oSettings.aiDisplayMaster; // all row numbers // set up data array var asResultData = new Array(); for (var i=0,c=aiRows.length; i<c; i++) { iRow = aiRows[i]; var aData = this.fnGetData(iRow); var sValue = aData[iColumn]; // ignore empty values? if (bIgnoreEmpty == true && sValue.length == 0) continue; // ignore unique values? else if (bUnique == true && jQuery.inArray(sValue, asResultData) > -1) continue; // else push the value onto the result data array else asResultData.push(sValue); } return asResultData;}}(jQuery)); function datatables_fnCreateSelect( aData ) { var r = '<select><option value=""></option>', i, iLen = aData.length; for ( i=0 ; i<iLen ; i++ ) { r += '<option value="'+aData[i]+'">'+aData[i]+'</option>'; } return r + '</select>';}

    Read the article

  • Help needed with Javascript Variable Scope / OOP and Call Back Functions

    - by gargantaun
    I think this issue goes beyond typical variable scope and closure stuff, or maybe I'm an idiot. Here goes anyway... I'm creating a bunch of objects on the fly in a jQuery plugin. The object look something like this function WedgePath(canvas){ this.targetCanvas = canvas; this.label; this.logLabel = function(){ console.log(this.label) } } the jQuery plugin looks something like this (function($) { $.fn.myPlugin = function() { return $(this).each(function() { // Create Wedge Objects for(var i = 1; i <= 30; i++){ var newWedge = new WedgePath(canvas); newWedge.label = "my_wedge_"+i; globalFunction(i, newWedge]); } }); } })(jQuery); So... the plugin creates a bunch of wedgeObjects, then calls 'globalFunction' for each one, passing in the latest WedgePath instance. Global function looks like this. function globalFunction(indicator_id, pWedge){ var targetWedge = pWedge; targetWedge.logLabel(); } What happens next is that the console logs each wedges label correctly. However, I need a bit more complexity inside globalFunction. So it actually looks like this... function globalFunction(indicator_id, pWedge){ var targetWedge = pWedge; someSql = "SELECT * FROM myTable WHERE id = ?"; dbInterface.executeSql(someSql, [indicator_id], function(transaction, result){ targetWedge.logLabel(); }) } There's a lot going on here so i'll explain. I'm using client side database storage (WebSQL i call it). 'dbInterface' an instance of a simple javascript object I created which handles the basics of interacting with a client side database [shown at the end of this question]. the executeSql method takes up to 4 arguments The SQL String an optional arguments array an optional onSuccess handler an optional onError handler (not used in this example) What I need to happen is: When the WebSQL query has completed, it takes some of that data and manipulates some attribute of a particular wedge. But, when I call 'logLabel' on an instance of WedgePath inside the onSuccess handler, I get the label of the very last instance of WedgePath that was created way back in the plugin code. Now I suspect that the problem lies in the var newWedge = new WedgePath(canvas); line. So I tried pushing each newWedge into an array, which I thought would prevent that line from replacing or overwriting the WedgePath instance at every iteration... wedgeArray = []; // Inside the plugin... for(var i = 1; i <= 30; i++){ var newWedge = new WedgePath(canvas); newWedge.label = "my_wedge_"+i; wedgeArray.push(newWedge); } for(var i = 0; i < wedgeArray.length; i++){ wedgeArray[i].logLabel() } But again, I get the last instance of WedgePath to be created. This is driving me nuts. I apologise for the length of the question but I wanted to be as clear as possible. END ============================================================== Also, here's the code for dbInterface object should it be relevant. function DatabaseInterface(db){ var DB = db; this.sql = function(sql, arr, pSuccessHandler, pErrorHandler){ successHandler = (pSuccessHandler) ? pSuccessHandler : this.defaultSuccessHandler; errorHandler = (pErrorHandler) ? pErrorHandler : this.defaultErrorHandler; DB.transaction(function(tx){ if(!arr || arr.length == 0){ tx.executeSql(sql, [], successHandler, errorHandler); }else{ tx.executeSql(sql,arr, successHandler, errorHandler) } }); } // ---------------------------------------------------------------- // A Default Error Handler // ---------------------------------------------------------------- this.defaultErrorHandler = function(transaction, error){ // error.message is a human-readable string. // error.code is a numeric error code console.log('WebSQL Error: '+error.message+' (Code '+error.code+')'); // Handle errors here var we_think_this_error_is_fatal = true; if (we_think_this_error_is_fatal) return true; return false; } // ---------------------------------------------------------------- // A Default Success Handler // This doesn't do anything except log a success message // ---------------------------------------------------------------- this.defaultSuccessHandler = function(transaction, results) { console.log("WebSQL Success. Default success handler. No action taken."); } }

    Read the article

  • Rails: Need a helping hand to finish this Jquery/Ajax problem.

    - by DJTripleThreat
    Here's my problem: I have a combo box that when its index changes I want a div tag with the id="services" to repopulate with checkboxes based on that comboboxes value. I want this to be done using ajax. This is my first time working with ajax for rails so I need a helping hand. Here is what I have so far: My application.js file. Something that Ryan uses in one of his railscasts. This is supposed to be a helper method for handling ajax requests. Is this useful? Should I be using this?: //<![CDATA[ $.ajaxSetup({ 'beforeSend': function(xhr) {xhr.setRequestHeader("Accept","text/javascript")} }); // This function doesn't return any results. How might I change that? Or // should I have another function to do that? $.fn.submitWithAjax = function() { this.submit(function() { $.post($(this).attr("action"), $(this).serialize(), null, "script"); return true; }); }; //]]> An external javascript file for this template (/public/javascripts/combo_box.js): //<![CDATA[ $(document).ready(function(){ $('#event_service_time_allotment').change(function () { // maybe I should be using submitWithAjax(); ?? $(this).parent().submit(); }); }); //]]> My ???.js.erb file. I'm not sure where this file should go. Should I make an ajax controller?? Someone help me out with that part please. I can write this code no problem, I just need to know where it should go and what the file name should be called (best practices etc): // new.js.erb: dynamic choices... expecting a time_allotment alert('test'); // TODO: Return a json object or something with a result set of services // I should be expecting something like: // params[:event_service][:time_allotment] i think which I should use // to return a json object (??) to be parsed or rendered html // for the div#services. Here is my controller's new action. Am I supposed to respond to javascript here? Should I make an ajax controller instead? What's the best way to do this?: # /app/controllers/event_services_controller.rb def new @event_service = EventService.new respond_to do |format| format.html # new.html.erb format.xml { render :xml => @event_service } format.js # should I have a javascript handler here? i'm lost! end end My /app/views/event_service/new.html.erb. My ajax call I think should be a different action then the form: <% content_for :head do %> <%= javascript_include_tag '/javascripts/combo_box.js' %> <% end %> <% form_for @event_service, :url => admin_events_path, :html => {:method => :post} do |f| %> <!-- TimeAllotment is a tabless model which is why this is done like so... --> <!-- This select produces an id of: "event_service_time_allotment" and a name of: "event_service[time_allotment]" --> <%= select("event_service", "time_allotment", TimeAllotment.all.collect {|ta| [ta.title, ta.value]}, {:prompt => true}) %> Services: <!-- this div right here needs to be repopulated when the above select changes. --> <div id="services"> <% for service_type in ServiceType.all %> <div> <%= check_box_tag "event_service[service_type_ids][]", service_type.id, false %> <%=h service_type.title %> </div> <% end %> </div> <% end %> ok so right now ALL of the services are there to be chosen from. I want them to change based on what is selected in the combobox event_service_time_allotment. Thanks, I know this is super complicated so any helpful answers will get an upvote.

    Read the article

  • Dynamic scoping in Clojure?

    - by j-g-faustus
    Hi, I'm looking for an idiomatic way to get dynamically scoped variables in Clojure (or a similar effect) for use in templates and such. Here is an example problem using a lookup table to translate tag attributes from some non-HTML format to HTML, where the table needs access to a set of variables supplied from elsewhere: (def *attr-table* ; Key: [attr-key tag-name] or [boolean-function] ; Value: [attr-key attr-value] (empty array to ignore) ; Context: Variables "tagname", "akey", "aval" '( ; translate :LINK attribute in <a> to :href [:LINK "a"] [:href aval] ; translate :LINK attribute in <img> to :src [:LINK "img"] [:src aval] ; throw exception if :LINK attribute in any other tag [:LINK] (throw (RuntimeException. (str "No match for " tagname))) ; ... more rules ; ignore string keys, used for internal bookkeeping [(string? akey)] [] )) ; ignore I want to be able to evaluate the rules (left hand side) as well as the result (right hand side), and need some way to put the variables in scope at the location where the table is evaluated. I also want to keep the lookup and evaluation logic independent of any particular table or set of variables. I suppose there are similar issues involved in templates (for example for dynamic HTML), where you don't want to rewrite the template processing logic every time someone puts a new variable in a template. Here is one approach using global variables and bindings. I have included some logic for the table lookup: ;; Generic code, works with any table on the same format. (defn rule-match? [rule-val test-val] "true if a single rule matches a single argument value" (cond (not (coll? rule-val)) (= rule-val test-val) ; plain value (list? rule-val) (eval rule-val) ; function call :else false )) (defn rule-lookup [test-val rule-table] "looks up rule match for test-val. Returns result or nil." (loop [rules (partition 2 rule-table)] (when-not (empty? rules) (let [[select result] (first rules)] (if (every? #(boolean %) (map rule-match? select test-val)) (eval result) ; evaluate and return result (recur (rest rules)) ))))) ;; Code specific to *attr-table* (def tagname) ; need these globals for the binding in html-attr (def akey) (def aval) (defn html-attr [tagname h-attr] "converts to html attributes" (apply hash-map (flatten (map (fn [[k v :as kv]] (binding [tagname tagname akey k aval v] (or (rule-lookup [k tagname] *attr-table*) kv))) h-attr )))) (defn test-attr [] "test conversion" (prn "a" (html-attr "a" {:LINK "www.google.com" "internal" 42 :title "A link" })) (prn "img" (html-attr "img" {:LINK "logo.png" }))) user=> (test-attr) "a" {:href "www.google.com", :title "A link"} "img" {:src "logo.png"} This is nice in that the lookup logic is independent of the table, so it can be reused with other tables and different variables. (Plus of course that the general table approach is about a quarter of the size of the code I had when I did the translations "by hand" in a giant cond.) It is not so nice in that I need to declare every variable as a global for the binding to work. Here is another approach using a "semi-macro", a function with a syntax-quoted return value, that doesn't need globals: (defn attr-table [tagname akey aval] `( [:LINK "a"] [:href ~aval] [:LINK "img"] [:src ~aval] [:LINK] (throw (RuntimeException. (str "No match for " tagname))) ; ... more rules [(string? ~akey)] [] ))) Only a couple of changes are needed to the rest of the code: In rule-match?, when syntax-quoted the function call is no longer a list: - (list? rule-val) (eval rule-val) + (seq? rule-val) (eval rule-val) In html-attr: - (binding [tagname tagname akey k aval v] - (or (rule-lookup [k tagname] *attr-table*) kv))) + (or (rule-lookup [k tagname] (attr-table tagname k v)) kv))) And we get the same result without globals. (And without dynamic scoping.) Are there other alternatives to pass along sets of variable bindings declared elsewhere, without the globals required by Clojure's binding? Is there an idiomatic way of doing it, like Ruby's binding or Javascript's function.apply(context)?

    Read the article

  • Saving in mongoDb with Mongoose, unexpected elements saved

    - by guiomie
    When I write in my mongoDB with mongoose the operation is treated with success, my document is saved, but there is also all kind of weird other sutff written down. It seems to be mongoose code. What could cause this? I add stuff in a specific array with: resultReference.ref[arrayLocation].allEvents.push(theEvent); {id: 11, allEvents: [] } is the structure of a ref element, and I push theEvent in the allEvents array. I then resultReference.save() I use express, mongoose and mongoHQ for database. I tried on a local mongo server, and this annoyance is still there. I've print in my console the document to write before save() and non of this weird code is there. { id 11 allEvents [ 0 { _events { maxListeners 0 } _doc { _id {"$oid": "4eb87834f54944e263000003"} title "Test" allDay false start 2011-11-10 13:00:00 UTC end 2011-11-10 15:00:00 UTC url "/test/4eb87834f54944e263000002" color "#99CCFF" ref "4eb87834f54944e263000002" } _activePaths { paths { title "modify" allDay "modify" start "modify" end "modify" url "modify" color "modify" ref "modify" } states { init { } modify { title true allDay true start true end true url true color true ref true } require { } } stateNames [ 0 "require" 1 "modify" 2 "init" ] } _saveError null _validationError null isNew true _pres { save [ 0 function (next) { // we keep the error semaphore to make sure we don't // call `save` unnecessarily (we only need 1 error) var subdocs = 0 , error = false , self = this; var arrays = this._activePaths .map('init', 'modify', function (i) { return self.getValue(i); }) .filter(function (val) { return (val && val instanceof DocumentArray && val.length); }); if (!arrays.length) return next(); arrays.forEach(function (array) { subdocs += array.length; array.forEach(function (value) { if (!error) value.save(function (err) { if (!error) { if (err) { error = true; next(err); } else --subdocs || next(); } }); }); }); } 1 "function checkForExistingErrors(next) { if (self._saveError){ next(self._saveError); self._saveError = null; } else { next(); } }" 2 "function validation(next) { return self.validate.call(self, next); }" ] } _posts { save [ ] } save function () { var self = this , hookArgs // arguments eventually passed to the hook - are mutable , lastArg = arguments[arguments.length-1] , pres = this._pres[name] , posts = this._posts[name] , _total = pres.length , _current = -1 , _asyncsLeft = proto[name].numAsyncPres , _next = function () { if (arguments[0] instanceof Error) { return handleError(arguments[0]); } var _args = Array.prototype.slice.call(arguments) , currPre , preArgs; if (_args.length && !(arguments[0] === null && typeof lastArg === 'function')) hookArgs = _args; if (++_current < _total) { currPre = pres[_current] if (currPre.isAsync && currPre.length < 2) throw new Error("Your pre must have next and done arguments -- e.g., function (next, done, ...)"); if (currPre.length < 1) throw new Error("Your pre must have a next argument -- e.g., function (next, ...)"); preArgs = (currPre.isAsync ? [once(_next), once(_asyncsDone)] : [once(_next)]).concat(hookArgs); return currPre.apply(self, preArgs); } else if (!proto[name].numAsyncPres) { return _done.apply(self, hookArgs); } } , _done = function () { var args_ = Array.prototype.slice.call(arguments) , ret, total_, current_, next_, done_, postArgs; if (_current === _total) { ret = fn.apply(self, args_); total_ = posts.length; current_ = -1; next_ = function () { if (arguments[0] instanceof Error) { return handleError(arguments[0]); } var args_ = Array.prototype.slice.call(arguments, 1) , currPost , postArgs; if (args_.length) hookArgs = args_; if (++current_ < total_) { currPost = posts[current_] if (currPost.length < 1) throw new Error("Your post must have a next argument -- e.g., function (next, ...)"); postArgs = [once(next_)].concat(hookArgs); return currPost.apply(self, postArgs); } }; if (total_) return next_(); return ret; } }; if (_asyncsLeft) { function _asyncsDone (err) { if (err && err instanceof Error) { return handleError(err); } --_asyncsLeft || _done.apply(self, hookArgs); } } function handleError (err) { if ('function' == typeof lastArg) return lastArg(err); if (errorCb) return errorCb.call(self, err); throw err; } return _next.apply(this, arguments); } errors null } ] } ]

    Read the article

  • Ajax call in a jQuery plugin not working properly

    - by Saneef
    I'm trying to create a jQuery plugin, inside I need to do an AJAX call to load an xml. jQuery.fn.imagetags = function(options) { s = jQuery.extend({ height:null, width:null, url:false, callback:null, title:null, }, options); return this.each(function(){ obj = $(this); //Initialising the placeholder $holder = $('<div />') .width(s.width).height(s.height) .addClass('jimageholder') .css({ position: 'relative', }); obj.wrap($holder); $.ajax({ type: "GET", url: s.url, dataType: "xml", success:function(data){ initGrids(obj,data,s.callback,s.title); } , error: function(data) { alert("Error loading Grid data."); }, }); function initGrids(obj, data,callback,gridtitle){ if (!data) { alert("Error loading Grid data"); } $("gridlist gridset",data).each(function(){ var gridsetname = $(this).children("setname").text(); var gridsetcolor = ""; if ($(this).children("color").text() != "") { gridsetcolor = $(this).children("color").text(); } $(this).children("grid").each(function(){ var gridcolor = gridsetcolor; //This colour will override colour set for the grid set if ($(this).children("color").text() != "") { gridcolor = $(this).children("color").text(); } //addGrid(gridsetname,id,x,y,height,width) addGrid( obj, gridsetname, $(this).children("id").text(), $(this).children("x").text(), $(this).children("y").text(), $(this).children("height").text(), $(this).children("width").text(), gridcolor, gridtitle ); }); }); } function addGrid(obj,gridsetname,id,x,y,height,width,color,gridtitle){ //To compensate for the 2px border height-=4; width-=4; $grid = $('<div />') .addClass(gridsetname) .attr("id",id) .addClass('gridtag') .imagetagsResetHighlight() .css({ "bottom":y+"px", "left":x+"px", "height":height+"px", "width":width+"px", }); if(gridtitle != null){ $grid.attr("title",gridtitle); } if(color != ""){ $grid.css({ "border-color":color, }); } obj.after($grid); } }); } The above plugin I bind with 2 DOM objects and loads two seperate XML files but the callback function is run only on the last DOM object using both loaded XML files. How can I fix this, so that the callback is applied on the corresponding DOMs. Is the above ajax call is correct? Sample usage: <script type="text/javascript"> $(function(){ $(".romeo img").imagetags({ height:500, width:497, url: "sample-data.xml", title: "Testing...", callback:function(id){ console.log(id); }, }); }); </script> <div class="padding-10 min-item background-color-black"> <div class="romeo"><img src="images/samplecontent/test_500x497.gif" alt="Image"> </div> </div> <script type="text/javascript"> $(function(){ $(".romeo2 img").imagetags({ height:500, width:497, url: "sample-data2.xml", title: "Testing...", callback:function(id){ console.log(id); }, }); }); </script> <div class="padding-10 min-item background-color-black"> <div class="romeo2"><img src="images/samplecontent/test2_500x497.gif" alt="Image"> </div> </div> Here is the sample XML data: <?xml version="1.0" encoding="utf-8"?> <gridlist> <gridset> <setname>gridset4</setname> <color>#00FF00</color> <grid> <color>#FF77FF</color> <id>grid2-324</id> <x>300</x> <y>300</y> <height>60</height> <width>60</width> </grid> </gridset> <gridset> <setname>gridset3</setname> <color>#00FF00</color> <grid> <color>#FF77FF</color> <id>grid2-212</id> <x>300</x> <y>300</y> <height>100</height> <width>100</width> </grid> <grid> <color>#FF77FF</color> <id>grid2-1212</id> <x>200</x> <y>10</y> <height>200</height> <width>10</width> </grid> </gridset> </gridlist>

    Read the article

  • PROBLEM: PHP strip_tags & multi-dimensional array form parameter

    - by Tunji Gbadamosi
    I'm having problems stripping the tags from the textual inputs retrieved from my form so as to do something with them in checkout.php. The input is stored in a multi-dimensional array. Here's my form: echo '<form name="choose" action="checkout.php" method="post" onsubmit="return validate_second_form(this);">'; echo '<input type="hidden" name="hidden_value" value="'.$no_guests.'" />'; if($no_guests >= 1){ echo '<div class="volunteer">'; echo '<fieldset>'; echo '<legend>Volunteer:</legend>'; echo '<label>Table:</label>'; echo '<select name="volunteer_table">'; foreach($tables as $t){ echo '<option>'.$t.'</option>'; } echo '</select><br><br>'; echo '<label>Seat number:</label>'; echo '<select name="volunteer_seat">'; foreach($seats as $seat){ echo '<option>'.$seat.'</option>'; } echo '</select><br><br>'; //echo '<br>'; echo '</fieldset>'; echo '</div>'; for($i=0;$i<$no_guests;$i++){ $guest = "guest_".$i; echo '<div class="'.$guest.'">'; echo '<fieldset>'; echo '<legend>Guest '.$i.':</legend>'; echo '<label>First Name:</label>'; echo '<input type="text" name="guest['.$i.']['.$first_name.']" id="fn'.$i.'">'; echo '<label>Surname:</label>'; echo '<input type="text" name="guest['.$i.']['.$surname.']" id="surname'.$i.'"><br><br>'; echo '<label>Date of Birth:</label> <br>'; echo '<label>Day:</label>'; echo '<select name="guest['.$i.'][dob_day]">'; for($j=1;$j<32;$j++){ echo"<option value='$j'>$j</option>"; } echo '</select>'; echo '<label>Month:</label>'; echo '<select name="guest['.$i.'][dob_month]">'; for($j=0;$j<sizeof($month);$j++){ $value = ($j + 1); echo"<option value='$value'>$month[$j]</option>"; } echo '</select>'; echo '<label>Year:</label>'; echo '<select name="guest['.$i.'][dob_year]">'; for($j=1900;$j<$year_limit;$j++){ echo"<option value='$j'>$j</option>"; } echo '</select> <br><br>'; echo '<label>Sex:</label>'; echo '<select name="guest['.$i.']['.$sex.']">'; echo '<option>Female</option>'; echo '<option>Male</option>'; echo '</select><br><br>'; echo '<label>Table:</label>'; echo '<select name="guest['.$i.']['.$table.']">'; foreach($tables as $t){ echo '<option>'.$t.'</option>'; } echo '</select><br><br>'; echo '<label>Seat number:</label>'; echo '<select name="guest['.$i.']['.$seat_no.']">'; foreach($seats as $seat){ echo '<option>'.$seat.'</option>'; } echo '</select><br><br>'; //echo '<br>'; echo '</fieldset>'; echo '</div>'; } } else{ echo '<div id="volunteer">'; echo '<fieldset>'; echo '<legend>Volunteer:</legend>'; echo '<label>Table:</label>'; echo '<select name="volunteer['.$table.']">'; foreach($tables as $t){ echo '<option>'.$t.'</option>'; } echo '</select><br><br>'; echo '<label>Seat number:</label>'; echo '<select name="volunteer['.$seat_no.']">'; foreach($seats as $seat){ echo '<option>'.$seat.'</option>'; } echo '</select><br><br>'; //echo '<br>'; echo '</fieldset>'; echo '</div>'; } echo '<input type="submit" value="Submit form">'; echo '</form>'; here's checkout.php: if(isset($_POST['guest'])){ foreach($_POST['guest'] as $guest){ $guest['first_name'] = strip_tags($guest['first_name']); $guest['surname'] = strip_tags($guest['surname']); } //$_SESSION['guest'] = $guests; }

    Read the article

  • Slide navigation problem multiple div movement

    - by littleMan
    I have almost figured it out but still doesn't quite work the way i want it to. my problem is this part. It scrolls the first element to the left but the second element just appears and doesn't scroll does anyone know what todo here. var i = jQuery('.wikiform .wizard .view').size(); jQuery('.wikiform .navigation input[name^=Next]').click(function () { jQuery('.wikiform .wizard .view').each(function (j) { jQuery(this).animate({ marginLeft: -(current.next().width() * (i - j)) }, 750); /*line above Im having problems with ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ */ current = current.next(); j++; }); }); my complete code down below test it out and see what Im doing wrong (function ($) { $.fn.WikiForm = function (options) { this.Mode = options.mode || 'CancelOk' || 'Ok' || 'Wizard'; var current = jQuery('.wikiform .view:first'); function positionForm() { jQuery('body') .css('overflow-y', 'hidden'); jQuery('<div id="overlay"></div>') .insertBefore('.wikiform') .css('top', jQuery(document).scrollTop()) .animate({ 'opacity': '0.8' }, 'slow'); jQuery('.wikiform') .css('height', jQuery('.wikiform .wizard .view:first').height() + jQuery('.wikiform .navigation').height()) .css('top', window.screen.availHeight / 2 - jQuery('.wikiform').height() / 2) .css('width', jQuery('.wikiform .wizard .view:first').width()) .css('left', -jQuery('.wikiform').width()) .animate({ marginLeft: jQuery(document).width() / 2 + jQuery('.wikiform').width() / 2 }, 750); jQuery('.wikiform .wizard') .css('overflow', 'hidden') .css('height', jQuery('.wikiform .wizard .view:first').height()); } if (this.Mode == "Wizard") { return this.each(function () { positionForm(); //alert(current.next().width()); var i = jQuery('.wikiform .wizard .view').size(); jQuery('.wikiform .navigation input[name^=Next]').click(function () { jQuery('.wikiform .wizard .view').each(function (j) { jQuery(this).animate({ marginLeft: -(current.next().width() * (i - j)) }, 750); current = current.next(); j++; }); }); jQuery('.wikiform .navigation input[name^=Back]').click(function () { }); }); } else if (this.Mode == "CancelOk") { return this.each(function () { }); } else { return this.each(function () { }); } }; })(jQuery); $(document).ready(function () { jQuery(window).bind("load", function () { jQuery(".wikiform").WikiForm({ mode: 'Wizard', speed:750, ease:"expoinout" }); }); }); <style type="text/css"> body { margin:0px; } #overlay { background-color:Black; position:absolute; top:0; left:0; height:100%; width:100%; } .wikiform { background-color:Green; position:absolute; } .wikiform .wizard { clear: both; } .wizard { position: relative; left: 0; top: 0; width: 100%; list-style-type: none; } .wizard .view { float:left; } .view .form { } .navigation { float:right; clear:left } #view1 { background-color:Aqua; width:300px; height:300px; } #view2 { background-color:Fuchsia; width:300px; height:300px; } </style> <title></title></head><body><form action="" method=""><div id="layout"><div id="header"> Header </div> <div id="content" style="height:2000px"> Content </div> <div id="footer"> Footer </div> </div> <div id="formView1" class="wikiform"> <div class="wizard"> <div id="view1" class="view"> <div class="form"> Content 1 </div> </div> <div id="view2" class="view"> <div class="form"> Content 2 </div> </div> </div> <div class="navigation"> <input type="button" name="Back" value=" Back " /> <input type="button" name="Next " class="Next" value=" Next " /> <input type="button" name="Cancel" value="Cancel" /> </div> </div>

    Read the article

  • Can't append to second container

    - by George Katsanos
    I have the following script: (function($) { $.fn.easyPaginate = function(options){ var defaults = { step: 4, delay: 100, numeric: true, nextprev: true, controls: 'pagination', current: 'current' }; var options = $.extend(defaults, options); var step = options.step; var lower, upper; var children = $(this).children(); var count = children.length; var obj, next, prev; var page = 1; var timeout; var clicked = false; function show(){ clearTimeout(timeout); lower = ((page-1) * step); upper = lower+step; $(children).each(function(i){ var child = $(this); child.hide(); if(i>=lower && i<upper){ setTimeout(function(){ child.fadeIn('fast') }, ( i-( Math.floor(i/step) * step) )*options.delay ); } if(options.nextprev){ if(upper >= count) { next.addClass('stop'); } else { next.removeClass('stop'); }; if(lower >= 1) { prev.removeClass('stop'); } else { prev.addClass('stop'); }; }; }); $('li','#'+ options.controls).removeClass(options.current); $('li[data-index="'+page+'"]','#'+ options.controls).addClass(options.current); if(options.auto){ if(options.clickstop && clicked){}else{ timeout = setTimeout(auto,options.pause); }; }; }; function auto(){ if(upper <= count){ page++; show(); } else { page--; show(); } }; this.each(function(){ obj = this; if(count>step){ var pages = Math.floor(count/step); if((count/step) > pages) pages++; var ol = $('<ol id="'+ options.controls +'" class="pagin"></ol>').insertAfter(obj); if(options.nextprev){ prev = $('<li class="prev">prev</li>') .appendTo(ol) .bind('click', function() { //check to see if there are any more pages in the negative direction if (page > 1) { clicked = true; page--; show(); } }); } if(options.numeric){ for(var i=1;i<=pages;i++){ $('<li data-index="'+ i +'">'+ i +'</li>') .appendTo(ol) .click(function(){ clicked = true; page = $(this).attr('data-index'); show(); }); }; }; if(options.nextprev){ next = $('<li class="next">next</li>') .appendTo(ol) .bind('click', function() { //check to see if there are any pages in the positive direction if (page < (count / 4)) { clicked = true; page++; show(); } }); } show(); }; }); }; })(jQuery); jQuery(function($){ $('ul.news').easyPaginate({step:4}); }); which is a carousel-like plugin that produces this html structure for the navigation: <ol id="pagination" class="pagin"><li class="prev">prev</li><li data-index="1" class="">1</li><li data-index="2" class="">2</li><li data-index="3" class="current">3</li><li class="next stop">next</li></ol> And all I want is to enclose this list in a div. Seems simple, but appendTo doesn't want to cooperate with me, or I'm doing something wrong (I'd appreciate if you would help me understand what that is..) So I'm modifying as such: var ol = $('<ol id="'+ options.controls +'" class="pagin"></ol>'); var tiv = $('<div id="lala"></div>'); ol.appendTo('#lala'); tiv.insertAfter(obj); I know how to chain, but I'm in "debugging" mode trying to understand why I don't get the result I imagine I would get: <div id="lala> <ol id="pagination><li>...... </li></ol> </div> I tried putting some console.log's to see the status of my variables but couldn't find something useful.. I guess there's something with DOM insertion I don't get.

    Read the article

  • Tomcat6 can't connect to MySql (The driver has not received any packets from the server)

    - by Tobias Wiesenthal
    Hi all, i'm running an Apache Tomcat 6.0.20 / MySQL 5.1.37-lubuntu / sun-java6-jdk /sun-java6-jre / sun-java6-bin on my local machine using Ubuntu 9.10 as OS. I'm trying to get a simple DB-query example running for 2 days now, but i still get this Exception: org.apache.jasper.JasperException: javax.servlet.ServletException: javax.servlet.jsp.JspException: Unable to get connection, DataSource invalid: "org.apache.commons.dbcp.SQLNestedException: Cannot create PoolableConnectionFactory (Communications link failure The last packet sent successfully to the server was 0 milliseconds ago. The driver has not received any packets from the server.)" org.apache.jasper.servlet.JspServletWrapper.handleJspException(JspServletWrapper.java:522) org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:398) org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:342) org.apache.jasper.servlet.JspServlet.service(JspServlet.java:267) javax.servlet.http.HttpServlet.service(HttpServlet.java:717) root cause javax.servlet.ServletException: javax.servlet.jsp.JspException: Unable to get connection, DataSource invalid: "org.apache.commons.dbcp.SQLNestedException: Cannot create PoolableConnectionFactory (Communications link failure The last packet sent successfully to the server was 0 milliseconds ago. The driver has not received any packets from the server.)" org.apache.jasper.runtime.PageContextImpl.doHandlePageException(PageContextImpl.java:862) org.apache.jasper.runtime.PageContextImpl.handlePageException(PageContextImpl.java:791) org.apache.jsp.index_jsp._jspService(index_jsp.java:104) org.apache.jasper.runtime.HttpJspBase.service(HttpJspBase.java:70) javax.servlet.http.HttpServlet.service(HttpServlet.java:717) org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:374) org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:342) org.apache.jasper.servlet.JspServlet.service(JspServlet.java:267) javax.servlet.http.HttpServlet.service(HttpServlet.java:717) root cause javax.servlet.jsp.JspException: Unable to get connection, DataSource invalid: "org.apache.commons.dbcp.SQLNestedException: Cannot create PoolableConnectionFactory (Communications link failure The last packet sent successfully to the server was 0 milliseconds ago. The driver has not received any packets from the server.)" org.apache.taglibs.standard.tag.common.sql.QueryTagSupport.getConnection(QueryTagSupport.java:285) org.apache.taglibs.standard.tag.common.sql.QueryTagSupport.doStartTag(QueryTagSupport.java:168) org.apache.jsp.index_jsp._jspx_meth_sql_005fquery_005f0(index_jsp.java:274) org.apache.jsp.index_jsp._jspx_meth_c_005fotherwise_005f0(index_jsp.java:216) org.apache.jsp.index_jsp._jspx_meth_c_005fchoose_005f0(index_jsp.java:130) org.apache.jsp.index_jsp._jspService(index_jsp.java:93) org.apache.jasper.runtime.HttpJspBase.service(HttpJspBase.java:70) javax.servlet.http.HttpServlet.service(HttpServlet.java:717) org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:374) org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:342) org.apache.jasper.servlet.JspServlet.service(JspServlet.java:267) javax.servlet.http.HttpServlet.service(HttpServlet.java:717) my web.xml looks like this : <?xml version="1.0" encoding="utf-8"?> <web-app xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" version="2.5"> <resource-ref> <description>DB Connection</description> <res-ref-name>jdbc/testDB</res-ref-name> <res-type>javax.sql.DataSource</res-type> <res-auth>Container</res-auth> </resource-ref> </web-app> the context.xml looks like this : <?xml version="1.0" encoding="UTF-8"?> <Context path="/my1stApp" docBase="/var/www/jsp/my1stApp" debug="5" reloadable="true" crossContext="true"> <Resource name="jdbc/testDB" auth="Container" type="javax.sql.DataSource" maxActive="5" maxIdle="5" maxWait="10000" username="user" password="password" driverClassName="com.mysql.jdbc.Driver" url="jdbc:mysql://localhost:3306/some"/> </Context> and the jsp file looks like this: <%@ page contentType="text/html" %> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %> <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %> <%@ taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql" %> <html> <head> <title>DroneLootTool</title> </head> <body bgcolor="white"> <sql:query var="res" dataSource="jdbc/testDB"> select name, othername from mytable </sql:query> <h2>Results</h2> <c:forEach var="row" items="${res.rows}"> Name ${row.name}<br/> MoreName ${row.othername}<br/><br/> </c:forEach> </body> </html> read lots of forum entries / tried lots of different settings (always changed back to original settings when it didnt' work) set TOMCAT6_SECURITY=no in /etc/default/tomcat6 because TOMCAT6_SECURITY=yes was causing trouble too the skip-networking flag is not set for the DB (BIND 127.0.0.1 is set) firewall is swiched off (sudo ufw disable) MySQL works (tested several times with user used in this skript) telnet localhost 3306 says Trying ::1... Trying 127.0.0.1... Connected to localhost. Escape character is '^]'. Connection closed by foreign host. The TestConnection.java produced the following output: me@my-laptop:~/Desktop$ java -classpath '/usr/share/java/mysql.jar:./' TestConnection com.mysql.jdbc.Driver jdbc:mysql://localhost:3306/testDB myuser mypassword com.mysql.jdbc.CommunicationsException: Communications link failure Last packet sent to the server was 0 ms ago. at com.mysql.jdbc.SQLError.createCommunicationsException(SQLError.java:1070) at com.mysql.jdbc.ConnectionImpl.createNewIO(ConnectionImpl.java:2103) at com.mysql.jdbc.ConnectionImpl.<init>(ConnectionImpl.java:718) at com.mysql.jdbc.ConnectionImpl.getInstance(ConnectionImpl.java:298) at com.mysql.jdbc.NonRegisteringDriver.connect(NonRegisteringDriver.java:282) at java.sql.DriverManager.getConnection(DriverManager.java:582) at java.sql.DriverManager.getConnection(DriverManager.java:185) at TestConnection.checkConnection(TestConnection.java:40) at TestConnection.main(TestConnection.java:21) Caused by: com.mysql.jdbc.CommunicationsException: Communications link failure Last packet sent to the server was 0 ms ago. at com.mysql.jdbc.SQLError.createCommunicationsException(SQLError.java:1070) at com.mysql.jdbc.MysqlIO.readPacket(MysqlIO.java:666) at com.mysql.jdbc.MysqlIO.doHandshake(MysqlIO.java:1069) at com.mysql.jdbc.ConnectionImpl.createNewIO(ConnectionImpl.java:2031) ... 7 more Caused by: java.io.EOFException: Can not read response from server. Expected to read 4 bytes, read 0 bytes before connection was unexpectedly lost. at com.mysql.jdbc.MysqlIO.readFully(MysqlIO.java:2431) at com.mysql.jdbc.MysqlIO.readPacket(MysqlIO.java:590) ... 9 more Connection failed. i don't know if there is a difference between the way the java driver connects to the DB and the Perl DBI module does, but this PERL skript works #!/usr/bin/perl -w use CGI; use DBI; use strict; print CGI::header(); my $dbh = DBI->connect("dbi:mysql:some:localhost", "user", "password"); my $sSql = "SELECT * from mytable"; my $ppl = $dbh->selectall_arrayref( $sSql ); foreach my $pl (@$ppl) { my @array = @$pl; print @array; } $dbh->disconnect; enabled --log-warnings on the mysql, but i didn't get any new warnings. When i was searching the logs for warnings i found this messages when i restart the tomcat, don't know if it helps to find the problem : Feb 2 19:50:37 tobias-laptop jsvc.exec[3129]: 02.02.2010 19:50:37 org.apache.catalina.startup.HostConfig checkResources#012INFO: Undeploying context [/myapp] Feb 2 19:50:37 tobias-laptop jsvc.exec[3129]: 02.02.2010 19:50:37 org.apache.catalina.loader.WebappClassLoader clearReferencesThreads#012SCHWERWIEGEND: A web application appears to have started a thread named [MySQL Statement Cancellation Timer] but has failed to stop it. This is very likely to create a memory leak. Feb 2 19:50:37 tobias-laptop jsvc.exec[3129]: 02.02.2010 19:50:37 org.apache.catalina.startup.HostConfig deployDescriptor#012INFO: Deploying configuration descriptor myapp.xml

    Read the article

  • Memory leak involving jQuery Ajax requests

    - by Eli Courtwright
    I have a webpage that's leaking memory in both IE8 and Firefox; the memory usage displayed in the Windows Process Explorer just keeps growing over time. The following page requests the "unplanned.json" url, which is a static file that never changes (though I do set my Cache-control HTTP header to no-cache to make sure that the Ajax request always goes through). When it gets the results, it clears out an HTML table, loops over the json array it got back from the server, and dynamically adds a row to an HTML table for each entry in the array. Then it waits 2 seconds and repeats this process. Here's the entire webpage: <html> <head> <title>Test Page</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script> </head> <body> <script type="text/javascript"> function kickoff() { $.getJSON("unplanned.json", resetTable); } function resetTable(rows) { $("#content tbody").empty(); for(var i=0; i<rows.length; i++) { $("<tr>" + "<td>" + rows[i].mpe_name + "</td>" + "<td>" + rows[i].bin + "</td>" + "<td>" + rows[i].request_time + "</td>" + "<td>" + rows[i].filtered_delta + "</td>" + "<td>" + rows[i].failed_delta + "</td>" + "</tr>").appendTo("#content tbody"); } setTimeout(kickoff, 2000); } $(kickoff); </script> <table id="content" border="1" style="width:100% ; text-align:center"> <thead><tr> <th>MPE</th> <th>Bin</th> <th>When</th> <th>Filtered</th> <th>Failed</th> </tr></thead> <tbody></tbody> </table> </body> </html> If it helps, here's an example of the json I'm sending back (it's this exact array wuith thousands of entries instead of just one): [ { mpe_name: "DBOSS-995", request_time: "09/18/2009 11:51:06", bin: 4, filtered_delta: 1, failed_delta: 1 } ] EDIT: I've accepted Toran's extremely helpful answer, but I feel I should post some additional code, since his removefromdom jQuery plugin has some limitations: It only removes individual elements. So you can't give it a query like `$("#content tbody tr")` and expect it to remove all of the elements you've specified. Any element that you remove with it must have an `id` attribute. So if I want to remove my `tbody`, then I must assign an `id` to my `tbody` tag or else it will give an error. It removes the element itself and all of its descendants, so if you simply want to empty that element then you'll have to re-create it afterwards (or modify the plugin to empty instead of remove). So here's my page above modified to use Toran's plugin. For the sake of simplicity I didn't apply any of the general performance advice offered by Peter. Here's the page which now no longer memory leaks: <html> <head> <title>Test Page</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script> </head> <body> <script type="text/javascript"> <!-- $.fn.removefromdom = function(s) { if (!this) return; var el = document.getElementById(this.attr("id")); if (!el) return; var bin = document.getElementById("IELeakGarbageBin"); //before deleting el, recursively delete all of its children. while (el.childNodes.length > 0) { if (!bin) { bin = document.createElement("DIV"); bin.id = "IELeakGarbageBin"; document.body.appendChild(bin); } bin.appendChild(el.childNodes[el.childNodes.length - 1]); bin.innerHTML = ""; } el.parentNode.removeChild(el); if (!bin) { bin = document.createElement("DIV"); bin.id = "IELeakGarbageBin"; document.body.appendChild(bin); } bin.appendChild(el); bin.innerHTML = ""; }; var resets = 0; function kickoff() { $.getJSON("unplanned.json", resetTable); } function resetTable(rows) { $("#content tbody").removefromdom(); $("#content").append('<tbody id="id_field_required"></tbody>'); for(var i=0; i<rows.length; i++) { $("#content tbody").append("<tr><td>" + rows[i].mpe_name + "</td>" + "<td>" + rows[i].bin + "</td>" + "<td>" + rows[i].request_time + "</td>" + "<td>" + rows[i].filtered_delta + "</td>" + "<td>" + rows[i].failed_delta + "</td></tr>"); } resets++; $("#message").html("Content set this many times: " + resets); setTimeout(kickoff, 2000); } $(kickoff); // --> </script> <div id="message" style="color:red"></div> <table id="content" border="1" style="width:100% ; text-align:center"> <thead><tr> <th>MPE</th> <th>Bin</th> <th>When</th> <th>Filtered</th> <th>Failed</th> </tr></thead> <tbody id="id_field_required"></tbody> </table> </body> </html> FURTHER EDIT: I'll leave my question unchanged, though it's worth noting that this memory leak has nothing to do with Ajax. In fact, the following code would memory leak just the same and be just as easily solved with Toran's removefromdom jQuery plugin: function resetTable() { $("#content tbody").empty(); for(var i=0; i<1000; i++) { $("#content tbody").append("<tr><td>" + "DBOSS-095" + "</td>" + "<td>" + 4 + "</td>" + "<td>" + "09/18/2009 11:51:06" + "</td>" + "<td>" + 1 + "</td>" + "<td>" + 1 + "</td></tr>"); } setTimeout(resetTable, 2000); } $(resetTable);

    Read the article

  • problem with tinymce textarea in dynamically added jquery tabs

    - by kranthi
    I have an aspx page(Default1.aspx),in which i have a static jquery tab and anchor tag upon clicking the anchor tag(Add Tab) I am adding new tab dynamically,which gets its contents loaded from another aspx page(Default2.aspx).This second page contains some text inside a tag,a textarea with 'tinymce' class which is placed inside a div with 'style="display:none" ' and this textarea gets displayed only upon clicking the edit button on that page. The HTML of Default1.aspx page looks like this. <head runat="server"> <title>Untitled Page</title> <script src="js/jquery-1.3.2.min.js" type="text/javascript"></script> <script src="js/jquery-ui-1.7.2.custom.min.js" type="text/javascript"></script> <link href="css/custom-theme/jquery-ui-1.7.2.custom.css" rel="stylesheet" type="text/css" /> <link href="css/widgets.css" rel="stylesheet" type="text/css" /> <link href="css/print.css" rel="stylesheet" type="text/css" /> <link href="css/reset.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/tiny_mce/jquery.tinymce.js"></script> <script type="text/javascript"> $(function() { //DECLARE FUNCTION: removetab var removetab = function(tabselector, index) { $(".removetab").click(function(){ $(tabselector).tabs('remove',index); }); }; //create tabs $("#tabs").tabs({ add: function(event, ui) { //select newely opened tab $(this).tabs('select',ui.index); //load function to close tab removetab($(this), ui.index); }, show: function(event, ui) { if($.fn.tinymce) { $('textarea.tinymce').tinymce({ // Location of TinyMCE script script_url : 'js/tiny_mce/tiny_mce.js', // General options theme : "advanced", plugins : "safari,style,layer,table,advhr,advimage,advlink,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template", // Theme options theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,bullist,numlist,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect", theme_advanced_buttons2 : "outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor", theme_advanced_buttons3 : "sub,sup,|,ltr,rtl,|,fullscreen", theme_advanced_toolbar_location : "top", theme_advanced_toolbar_align : "left" /*theme_advanced_statusbar_location : "bottom",*/ /*theme_advanced_resizing : true,*/ }); } //load function to close selected tabs removetab($(this), ui.index); } }); //load new tab $(".addtab").click(function(){ var href=$(this).attr("href"); var title=$(this).attr("title"); $("#tabs").tabs( 'add' , href , title+' <span class="removetab ui-icon ui-icon-circle-close" style="float:right; margin: -2px -10px 0px 3px; cursor:pointer;"></span>'); return false; }); }); function showEditFields(){ $('.edit').css('display','inline'); } </script> </head> <body> <form id="form1" runat="server"> <div> <a class="addtab" title="Tab Label" href="HTMLPage.htm">Add Tab</a> <div id="tabs"> <ul> <li><a href="#tabs-1">Default Tab</a></li> </ul> <div id="tabs-1"> <p>Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante.sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p> </div> </div> </div> </form> </body> and the HTML of Default2.aspx looks like this. <head> </head> <body> <form id="form1" runat="server"> <div class="demo"> <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus. <div class="edit" style="display:none"> <textarea style="height:80px; width:100%" class="tinymce" name="" rows="8" runat="server" id="txtans">answer text goes here </textarea> </div> <input id="Button1" type="button" value="edit" onclick="showEditFields();" /> </p> </form> </body> so when I click on the "edit" button available on Default2.aspx ,the textarea with tinymce should appear and I can add as many tabs as I want from Default1.aspx by clicking on Add Tab(anchor) which loads multiple tabs with content from Default2.aspx.After adding these multiple tabs ,if I check to see whether all the textareas are with tinymce,I noticed that only the 1st tab contains textarea with tinymce and in all the other tabs tinymce doesnt show up ,simply the normal text area appears. Could someone please help me with this? Thanks.

    Read the article

  • vertical accordion from horizontal

    - by Sify Juhy
    //# jQuery - Horizontal Accordion //# Version 2.00.00 Alpha 1 //# //# portalZINE(R) - New Media Network //# http://www.portalzine.de //# //# Alexander Graef //# [email protected] //# //# Copyright 2007-2009 (function($) { $.hrzAccordion = { setOnEvent: function(i, container, finalWidth, settings){ $("#"+container+"Handle"+i).bind(settings.eventTrigger,function() { var status = $('[rel='+container+'ContainerSelected]').data('status'); if(status ==1 && settings.eventWaitForAnim === true){ return false; } if( $("#"+container+"Handle"+i).attr("rel") != container+"HandleSelected"){ settings.eventAction; $('[id*='+container+'Handle]').attr("rel",""); $('[id*='+container+'Handle]').attr("class",settings.handleClass); $("#"+container+"Handle"+i).addClass(settings.handleClassSelected); $("."+settings.contentWrapper).css({width: finalWidth+"px" }); switch(settings.closeOpenAnimation) { case 1: if($('[rel='+container+'ContainerSelected]').get(0) ){ $('[rel='+container+'ContainerSelected]').data('status',1); //current_width = $('[rel='+container+'ContainerSelected]').width(); $('[rel='+container+'ContainerSelected]').animate({width: "0px",opacity:"0"}, { queue:true, duration:settings.closeSpeed ,easing:settings.closeEaseAction,complete: function(){ $('[rel='+container+'ContainerSelected]').data('status',0); } ,step: function(now){ width = $(this).width(); //new_width = finalWidth- (finalWidth * (width/current_width)); new_width = finalWidth - width; $('#'+container+'Content'+i).width(Math.ceil(new_width)).css("opacity","1"); }}); }else{ $('[rel='+container+'ContainerSelected]').data('status',1); $('#'+container+'Content'+i).animate({width: finalWidth,opacity:"1"}, { queue:false, duration:settings.closeSpeed ,easing:settings.closeEaseAction,complete: function(){ $('[rel='+container+'ContainerSelected]').data('status',0); }}); } break; case 2: $('[id*='+container+'Content]').css({width: "0px"}); $('#'+container+'Content'+i).animate({width: finalWidth+"px",opacity:"1"}, { queue:false, duration:settings.openSpeed ,easing:settings.openEaseAction, complete: settings.completeAction }); break; } $('[id*='+container+'Content]').attr("rel",""); $("#"+container+"Handle"+i).attr("rel",container+"HandleSelected"); $("#"+container+"Content"+i).attr("rel",container+"ContainerSelected"); } }); } }; $.fn.extend({ hrzAccordionLoop: function(options) { return this.each(function(a){ var container = $(this).attr("id") || $(this).attr("class"); var elementCount = $('#'+container+' > li, .'+container+' > li').size(); var settings = $(this).data('settings'); variable_holder="interval"+container ; var i =0; var loopStatus = "start"; variable_holder = window.setInterval(function(){ $("#"+container+"Handle"+i).trigger(settings.eventTrigger); if(loopStatus =="start"){ i = i + 1; }else{ i = i-1; } if(i==elementCount && loopStatus == "start"){ loopStatus = "end"; i=elementCount-1; } if(i==0 && loopStatus == "end"){ loopStatus = "start"; i=0; } },settings.cycleInterval); }); }, hrzAccordion: function(options) { this.settings = { eventTrigger : "click", containerClass : "container", listItemClass : "listItem", contentContainerClass : "contentContainer", contentWrapper : "contentWrapper", contentInnerWrapper : "contentInnerWrapper", handleClass : "handle", handleClassOver : "handleOver", handleClassSelected : "handleSelected", handlePosition : "right", handlePositionArray : "", // left,left,right,right,right closeEaseAction : "swing", closeSpeed : 500, openEaseAction : "swing", openSpeed : 500, openOnLoad : 2, hashPrefix : "tab", eventAction : function(){ //add your own extra clickAction function here }, completeAction : function(){ //add your own onComplete function here }, closeOpenAnimation : 1,// 1 - open and close at the same time / 2- close all and than open next cycle : false, // not integrated yet, will allow to cycle through tabs by interval cycleInterval : 10000, fixedWidth : "", eventWaitForAnim : true }; if(options){ $.extend(this.settings, options); } var settings = this.settings; return this.each(function(a){ var container = $(this).attr("id") || $(this).attr("class"); $(this).data('settings', settings); $(this).wrap("<div class='"+settings.containerClass+"'></div>"); var elementCount = $('#'+container+' > li, .'+container+' > li').size(); var containerWidth = $("."+settings.containerClass).width(); var handleWidth = $("."+settings.handleClass).css("width"); handleWidth = handleWidth.replace(/px/,""); var finalWidth; var handle; if(settings.fixedWidth){ finalWidth = settings.fixedWidth; }else{ finalWidth = containerWidth-(elementCount*handleWidth)-handleWidth; } $('#'+container+' > li, .'+container+' > li').each(function(i) { $(this).attr('id', container+"ListItem"+i); $(this).attr('class',settings.listItemClass); $(this).html("<div class='"+settings.contentContainerClass+"' id='"+container+"Content"+i+"'>" +"<div class=\""+settings.contentWrapper+"\">" +"<div class=\""+settings.contentInnerWrapper+"\">" +$(this).html() +"</div></div></div>"); if($("div",this).hasClass(settings.handleClass)){ var html = $("div."+settings.handleClass,this).attr("id",""+container+"Handle"+i+"").html(); $("div."+settings.handleClass,this).remove(); handle = "<div class=\""+settings.handleClass+"\" id='"+container+"Handle"+i+"'>"+html+"</div>"; }else{ handle = "<div class=\""+settings.handleClass+"\" id='"+container+"Handle"+i+"'></div>"; } if(settings.handlePositionArray){ splitthis = settings.handlePositionArray.split(","); settings.handlePosition = splitthis[i]; } switch(settings.handlePosition ){ case "left": $(this).prepend( handle ); break; case "right": $(this).append( handle ); break; case "top": $("."+container+"Top").append( handle ); break; case "bottom": $("."+container+"Bottom").append( handle ); break; } $("#"+container+"Handle"+i).bind("mouseover", function(){ $("#"+container+"Handle"+i).addClass(settings.handleClassOver); }); $("#"+container+"Handle"+i).bind("mouseout", function(){ if( $("#"+container+"Handle"+i).attr("rel") != "selected"){ $("#"+container+"Handle"+i).removeClass(settings.handleClassOver); } }); $.hrzAccordion.setOnEvent(i, container, finalWidth, settings); if(i == elementCount-1){ $('#'+container+",."+container).show(); } if(settings.openOnLoad !== false && i == elementCount-1){ var location_hash = location.hash; location_hash = location_hash.replace("#", ""); if(location_hash.search(settings.hashPrefix) != '-1' ){ var tab = 1; location_hash = location_hash.replace(settings.hashPrefix, ""); } if(location_hash && tab ==1){ $("#"+container+"Handle"+(location_hash)).attr("rel",container+"HandleSelected"); $("#"+container+"Content"+(location_hash)).attr("rel",container+"ContainerSelected"); $("#"+container+"Handle"+(location_hash-1)).trigger(settings.eventTrigger); }else{ $("#"+container+"Handle"+(settings.openOnLoad)).attr("rel",container+"HandleSelected"); $("#"+container+"Content"+(settings.openOnLoad)).attr("rel",container+"ContainerSelected"); $("#"+container+"Handle"+(settings.openOnLoad-1)).trigger(settings.eventTrigger); } } }); if(settings.cycle === true){ $(this).hrzAccordionLoop(); } }); } }); })(jQuery); **Given is the code used for the accordion...please check out this Accordion Link. in the link there are four examples of accordions. i want the last accordion i.e example 4 to be vertical ...kindly help me.

    Read the article

  • WordPress 'comment is awaiting moderation.' message not appearing when a comment is submitted?

    - by cs
    Everything is pretty standard from WP samples, with minor modifications. But when a comment is submitted, it does not show the "your comment is awaiting moderation" message. The comments.php: <div id="comment-block"> <h4><?php comments_number('No Responses', 'One Response', '% Responses' );?> to &#8220;<?php the_title(); ?>&#8221;</h4> <ul id="commentlist"> <?php wp_list_comments('type=comment&callback=mytheme_comment'); ?> </ul> <?php // this is displayed if there are no comments so far ?> <?php if ('open' == $post->comment_status) : ?> <!-- If comments are open, but there are no comments. --> <?php else : // comments are closed ?> <!-- If comments are closed. --> <p class="nocomments">Comments are closed.</p> <?php endif; ?> <?php if ('open' == $post->comment_status) : ?> <h4>Leave a reply</h4> <div class="cancel-comment-reply"> <small><?php cancel_comment_reply_link(); ?></small> </div> <?php if ( get_option('comment_registration') && !$user_ID ) : ?> <p>You must be <a href="<?php echo get_option('siteurl'); ?>/wp-login.php?redirect_to=<?php echo urlencode(get_permalink()); ?>">logged in</a> to post a comment.</p> <?php else : ?> <form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform"> <?php if ( $user_ID ) : ?> <p class="loggedIn">Logged in as <a href="<?php echo get_option('siteurl'); ?>/wp-admin/profile.php"><?php echo $user_identity; ?></a>. <a href="<?php echo wp_logout_url(get_permalink()); ?>" title="Log out of this account">Log out &raquo;</a></p> <?php else : ?> <table width="675" cellpadding="0" cellspacing="0" border="0"> <tr><td style="padding-right: 20px;"><label for="author">Name <?php if ($req) echo "(required)"; ?></label></td> <td style="padding-right: 20px;"><label for="email">Email <?php if ($req) echo "(required)"; ?></label> <small>(will not be published)</small></td> <td><label for="url">Website <?php if ($req) echo "(required)"; ?></label></td> </tr> <tr><td style="padding-right: 20px;"><input type="text" name="author" id="author" value="<?php echo $comment_author; ?>" class="text" tabindex="1" <?php if ($req) echo "aria-required='true'"; ?> /></td> <td style="padding-right: 20px;"><input type="text" name="email" id="email" value="<?php echo $comment_author_email; ?>" class="text" tabindex="2" <?php if ($req) echo "aria-required='true'"; ?> /></td> <td><input type="text" name="url" id="url" value="<?php echo $comment_author_url; ?>" class="text" tabindex="3" /></td> </tr> </table> <?php endif; ?> <label for="comment">Comment <?php if ($req) echo "(required)"; ?></label><br /> <textarea name="comment" id="comment" rows="10" tabindex="4" class="text"></textarea> <input name="submit" type="image" src="<?php bloginfo('template_directory'); ?>/images/submit_button.png" width="130" height="24" alt="Submit" id="submit" tabindex="5" /> <?php comment_id_fields(); ?> <?php do_action('comment_form', $post->ID); ?> </form> <div class="clear"></div> <?php endif; // If registration required and not logged in ?> </div> <?php endif; // if you delete this the sky will fall on your head ?> And the mytheme_comments function in functions.php function mytheme_comment($comment, $args, $depth) { $GLOBALS['comment'] = $comment; ?> <li <?php comment_class(); ?> id="li-comment-<?php comment_ID() ?>"> <div id="comment-<?php comment_ID(); ?>"> <span class="comment-author vcard"> <?php printf(__('<cite class="fn">%s</cite> <span class="says">says at</span>'), get_comment_author_link()) ?> </span> <?php if ($comment->comment_approved == '0') : ?> <em><?php _e('Your comment is awaiting moderation.') ?></em> <br /> <?php endif; ?> <span class="comment-meta commentmetadata"><a href="<?php echo htmlspecialchars( get_comment_link( $comment->comment_ID ) ) ?>"> <?php printf(__('%2$s, %1$s'), get_comment_date(), get_comment_time()) ?></a><?php edit_comment_link(__('(Edit)'),' ','') ?></span> <?php comment_text() ?> <div class="reply"> <?php comment_reply_link(array_merge( $args, array('depth' => $depth, 'max_depth' => $args['max_depth']))) ?> </div> </div> <?php } ?>

    Read the article

  • Trying to randomise a jQuery content slider

    - by alecrust
    Hi everyone, I'm using a very nice jQuery content slider called Easy Slider on my site that I downloaded from Css Globe. The script is excellent and does just what I want - except I can't make it randomise the list, it always scrolls from left to right or right to left! I'm far from good with JavaScript, so my attempts at solving this have been feeble. Although I'm sure it must be an easy fix! If anyone wouldn't mind taking a glance over the script to see if they can spot what I need to change to make it random it would be greatly appreciated! I've tried contacting the original plugin developer but have had no response yet. The comments on the Easy Slider page didn't bear much fruit either unfortunately. I've pasted the script I'm using on my site below: /* * Easy Slider 1.7 - jQuery plugin * written by Alen Grakalic * http://cssglobe.com/post/4004/easy-slider-15-the-easiest-jquery-plugin-for-sliding * * Copyright (c) 2009 Alen Grakalic (http://cssglobe.com) * Dual licensed under the MIT (MIT-LICENSE.txt) * and GPL (GPL-LICENSE.txt) licenses. * * Built for jQuery library * http://jquery.com * */ (function($) { $.fn.easySlider = function(options){ // default configuration properties var defaults = { prevId: 'prevBtn', prevText: 'Previous', nextId: 'nextBtn', nextText: 'Next', controlsShow: true, controlsBefore: '', controlsAfter: '', controlsFade: true, firstId: 'firstBtn', firstText: 'First', firstShow: false, lastId: 'lastBtn', lastText: 'Last', lastShow: false, vertical: false, speed: 800, auto: false, pause: 7000, continuous: false, numeric: false, numericId: 'controls' }; var options = $.extend(defaults, options); this.each(function() { var obj = $(this); var s = $("li", obj).length; var w = $("li", obj).width(); var h = $("li", obj).height(); var clickable = true; obj.width(w); obj.height(h); obj.css("overflow","hidden"); var ts = s-1; var t = 0; $("ul", obj).css('width',s*w); if(options.continuous){ $("ul", obj).prepend($("ul li:last-child", obj).clone().css("margin-left","-"+ w +"px")); $("ul", obj).append($("ul li:nth-child(2)", obj).clone()); $("ul", obj).css('width',(s+1)*w); }; if(!options.vertical) $("li", obj).css('float','left'); if(options.controlsShow){ var html = options.controlsBefore; if(options.numeric){ html += '<ol id="'+ options.numericId +'"></ol>'; } else { if(options.firstShow) html += '<span id="'+ options.firstId +'"><a href=\"javascript:void(0);\">'+ options.firstText +'</a></span>'; html += ' <span id="'+ options.prevId +'"><a href=\"javascript:void(0);\">'+ options.prevText +'</a></span>'; html += ' <span id="'+ options.nextId +'"><a href=\"javascript:void(0);\">'+ options.nextText +'</a></span>'; if(options.lastShow) html += ' <span id="'+ options.lastId +'"><a href=\"javascript:void(0);\">'+ options.lastText +'</a></span>'; }; html += options.controlsAfter; $(obj).after(html); }; if(options.numeric){ for(var i=0;i<s;i++){ $(document.createElement("li")) .attr('id',options.numericId + (i+1)) .html('<a rel='+ i +' href=\"javascript:void(0);\">'+ (i+1) +'</a>') .appendTo($("#"+ options.numericId)) .click(function(){ animate($("a",$(this)).attr('rel'),true); }); }; } else { $("a","#"+options.nextId).click(function(){ animate("next",true); }); $("a","#"+options.prevId).click(function(){ animate("prev",true); }); $("a","#"+options.firstId).click(function(){ animate("first",true); }); $("a","#"+options.lastId).click(function(){ animate("last",true); }); }; function setCurrent(i){ i = parseInt(i)+1; $("li", "#" + options.numericId).removeClass("current"); $("li#" + options.numericId + i).addClass("current"); }; function adjust(){ if(t>ts) t=0; if(t<0) t=ts; if(!options.vertical) { $("ul",obj).css("margin-left",(t*w*-1)); } else { $("ul",obj).css("margin-left",(t*h*-1)); } clickable = true; if(options.numeric) setCurrent(t); }; function animate(dir,clicked){ if (clickable){ clickable = false; var ot = t; switch(dir){ case "next": t = (ot>=ts) ? (options.continuous ? t+1 : ts) : t+1; break; case "prev": t = (t<=0) ? (options.continuous ? t-1 : 0) : t-1; break; case "first": t = 0; break; case "last": t = ts; break; default: t = dir; break; }; var diff = Math.abs(ot-t); var speed = diff*options.speed; if(!options.vertical) { p = (t*w*-1); $("ul",obj).animate( { marginLeft: p }, { queue:false, duration:speed, complete:adjust } ); } else { p = (t*h*-1); $("ul",obj).animate( { marginTop: p }, { queue:false, duration:speed, complete:adjust } ); }; if(!options.continuous && options.controlsFade){ if(t==ts){ $("a","#"+options.nextId).hide(); $("a","#"+options.lastId).hide(); } else { $("a","#"+options.nextId).show(); $("a","#"+options.lastId).show(); }; if(t==0){ $("a","#"+options.prevId).hide(); $("a","#"+options.firstId).hide(); } else { $("a","#"+options.prevId).show(); $("a","#"+options.firstId).show(); }; }; if(clicked) clearTimeout(timeout); if(options.auto && dir=="next" && !clicked){; timeout = setTimeout(function(){ animate("next",false); },diff*options.speed+options.pause); }; }; }; // init var timeout; if(options.auto){; timeout = setTimeout(function(){ animate("next",false); },options.pause); }; if(options.numeric) setCurrent(0); if(!options.continuous && options.controlsFade){ $("a","#"+options.prevId).hide(); $("a","#"+options.firstId).hide(); }; }); }; })(jQuery); Many thanks again! Alec

    Read the article

  • Avoid Jquery Plugin Conflict

    - by user1511579
    on the same page i'm using this plugin: $g=jQuery.noConflict(); $g(function() { /* number of fieldsets */ var fieldsetCount = $g('#formElem').children().length; /* current position of fieldset / navigation link */ var current = 1; /* sum and save the widths of each one of the fieldsets set the final sum as the total width of the steps element */ var stepsWidth = 0; var widths = new Array(); $g('#steps .step').each(function(i){ var $step = $g(this); widths[i]   = stepsWidth; stepsWidth += $step.width(); }); $g('#steps').width(stepsWidth); /* to avoid problems in IE, focus the first input of the form */ $g('#formElem').children(':first').find(':input:first').focus(); /* show the navigation bar */ $g('#navigation_form').show(); /* when clicking on a navigation link  the form slides to the corresponding fieldset */ $g('#navigation_form a').bind('click',function(e){ var $this = $g(this); var prev = current; $this.closest('ul').find('li').removeClass('selected'); $this.parent().addClass('selected'); /* we store the position of the link in the current variable */ current = $this.parent().index() + 1; /* animate / slide to the next or to the corresponding fieldset. The order of the links in the navigation is the order of the fieldsets. Also, after sliding, we trigger the focus on the first  input element of the new fieldset If we clicked on the last link (confirmation), then we validate all the fieldsets, otherwise we validate the previous one before the form slided */ $g('#steps').stop().animate({ marginLeft: '-' + widths[current-1] + 'px' },500,function(){ if(current == fieldsetCount) validateSteps(); else validateStep(prev); $g('#formElem').children(':nth-child('+ parseInt(current) +')').find(':input:first').focus(); }); e.preventDefault(); }); /* clicking on the tab (on the last input of each fieldset), makes the form slide to the next step */ $g('#formElem > fieldset').each(function(){ var $fieldset = $g(this); $fieldset.children(':last').find(':input').keydown(function(e){ if (e.which == 9){ $g('#navigation_form li:nth-child(' + (parseInt(current)+1) + ') a').click(); /* force the blur for validation */ $g(this).blur(); e.preventDefault(); } }); }); /* validates errors on all the fieldsets records if the Form has errors in $('#formElem').data() */ function validateSteps(){ var FormErrors = false; for(var i = 1; i < fieldsetCount; ++i){ var error = validateStep(i); if(error == -1) FormErrors = true; } $g('#formElem').data('errors',FormErrors); } /* validates one fieldset and returns -1 if errors found, or 1 if not */ function validateStep(step){ if(step == fieldsetCount) return; var error = 1; var hasError = false; $g('#formElem').children(':nth-child('+ parseInt(step) +')').find(':input:not(button)').each(function(){ var $this = $g(this); var valueLength = jQuery.trim($this.val()).length; if(valueLength == ''){ hasError = true; $this.css('background-color','#FFEDEF'); } else $this.css('background-color','#FFFFFF'); }); var $link = $g('#navigation_form li:nth-child(' + parseInt(step) + ') a'); $link.parent().find('.error,.checked').remove(); var valclass = 'checked'; if(hasError){ error = -1; valclass = 'error'; } $g('<span class="'+valclass+'"></span>').insertAfter($link); return error; } /* if there are errors don't allow the user to submit */ $g('#registerButton').bind('click',function(){ if($g('#formElem').data('errors')){ alert('Please correct the errors in the Form'); return false; } }); }); and this one: (function($){ $countCursos = 1; $countFormsA = 1; $countFormsB = 1; $.fn.addForms = function(idform){ var adicionar_curso = "<p>"+ " <label for='nome_curso'>Nome do Curso</label>"+ " <input id='nome_curso' name='nome_curso["+$countCursos+"]' type='text' />"+ " </p>"; var myform2 = "<table>"+ " <tr>"+ " <td>Field C</td>"+ " <td><input type='text' name='fieldc["+$countFormsA+"]'></td>"+ " <td>Field D ("+$countFormsA+"):</td>"+ " <td><textarea name='fieldd["+$countFormsA+"]'></textarea></td>"+ " <td><button>remove</button></td>"+ " </tr>"+ "</table>"; var myform3 = "<table>"+ " <tr>"+ " <td>Field C</td>"+ " <td><input type='text' name='fieldc["+$countFormsB+"]'></td>"+ " <td>Field D ("+$countFormsB+"):</td>"+ " <td><textarea name='fieldd["+$countFormsB+"]'></textarea></td>"+ " <td><button>remove</button></td>"+ " </tr>"+ "</table>"; if(idform=='novo_curso'){ alert(idform); adicionar_curso = $("<div>"+adicionar_curso+"</div>"); $("button", $(adicionar_curso)).click(function(){ $(this).parent().parent().remove(); }); $(this).append(adicionar_curso); $countCursos++; } if(idform=='mybutton1'){ alert(idform); myform2 = $("<div>"+myform2+"</div>"); $("button", $(myform2)).click(function(){ $(this).parent().parent().remove(); }); $(this).append(myform2); $countFormsA++; } if(idform=='mybutton2'){ alert(idform); myform3 = $("<div>"+myform3+"</div>"); $("button", $(myform3)).click(function(){ $(this).parent().parent().remove(); }); $(this).append(myform3); $countFormsB++; } }; })(jQuery); $(function(){ $("#mybutton1").bind("click", function(e){ e.preventDefault(); var idform=this.id; if($countFormsA<3){ $("#container1").addForms(idform); } }); }); $(function(){ $("#novo_curso").bind("click", function(e){ e.preventDefault(); var idform=this.id; alert(idform); if($countCursos<3){ $("#outro_curso").addForms(idform); } }); }); $(function(){ $("#mybutton2").bind("click", function(e){ e.preventDefault(); var idform=this.id; if($countFormsB<3){ $("#container2").addForms(idform); } }); }); My problem is the two are making conflict: I added previously the $g on the first to avoid conflict, but the truth is they don't work together, any hint how can i configure the second one to avoid this? Thanks in advance!

    Read the article

  • Tips on how to refactor this unwieldy upvote/downvote code

    - by bob_cobb
    Basically this code is for an upvote/downvote system and I'm basically Incrementing the count by 1 when voting up Decrementing the count by 1 when voting down If the number of downvotes upvotes, we'll assume it's a negative score, so the count stays 0 Reverting the count back to what it originally was when clicking upvote twice or downvote twice Never go below 0 (by showing negative numbers); Basically it's the same scoring scheme reddit uses, and I tried to get some ideas from the source which was minified and kind of hard to grok: a.fn.vote = function(b, c, e, j) { if (reddit.logged && a(this).hasClass("arrow")) { var k = a(this).hasClass("up") ? 1 : a(this).hasClass("down") ? -1 : 0, v = a(this).all_things_by_id(), p = v.children().not(".child").find(".arrow"), q = k == 1 ? "up" : "upmod"; p.filter("." + q).removeClass(q).addClass(k == 1 ? "upmod" : "up"); q = k == -1 ? "down" : "downmod"; p.filter("." + q).removeClass(q).addClass(k == -1 ? "downmod" : "down"); reddit.logged && (v.each(function() { var b = a(this).find(".entry:first, .midcol:first"); k > 0 ? b.addClass("likes").removeClass("dislikes unvoted") : k < 0 ? b.addClass("dislikes").removeClass("likes unvoted") : b.addClass("unvoted").removeClass("likes dislikes") }), a.defined(j) || (j = v.filter(":first").thing_id(), b += e ? "" : "-" + j, a.request("vote", {id: j,dir: k,vh: b}))); c && c(v, k) } }; I'm trying to look for a pattern, but there are a bunch of edge cases that I've been adding in, and it's still a little off. My code (and fiddle): $(function() { var down = $('.vote-down'); var up = $('.vote-up'); var direction = up.add(down); var largeCount = $('#js-large-count'); var totalUp = $('#js-total-up'); var totalDown = $('#js-total-down'); var totalUpCount = parseInt(totalUp.text(), 10); var totalDownCount = parseInt(totalDown.text(), 10); var castVote = function(submissionId, voteType) { /* var postURL = '/vote'; $.post(postURL, { submissionId : submissionId, voteType : voteType } , function (data){ if (data.response === 'success') { totalDown.text(data.downvotes); totalUp.text(data.upvotes); } }, 'json'); */ alert('voted!'); }; $(direction).on('click', direction, function () { // The submission ID var $that = $(this), submissionId = $that.attr('id'), voteType = $that.attr('dir'), // what direction was voted? [up or down] isDown = $that.hasClass('down'), isUp = $that.hasClass('up'), curVotes = parseInt($that.parent().find('div.count').text(), 10); // current vote castVote(submissionId, voteType); // Voted up on submission if (voteType === 'up') { var alreadyVotedUp = $that.hasClass('likes'), upCount = $that.next('div.count'), dislikes = $that.nextAll('a').first(); // next anchor attr if (alreadyVotedUp) { // Clicked the up arrow and previously voted up $that.toggleClass('likes up'); if (totalUpCount > totalDownCount) { upCount.text(curVotes - 1); largeCount.text(curVotes - 1); } else { upCount.text(0); largeCount.text(0); } upCount.css('color', '#555').hide().fadeIn(); largeCount.hide().fadeIn(); } else if (dislikes.hasClass('dislikes')) { // Voted down now are voting up if (totalDownCount > totalUpCount) { upCount.text(0); largeCount.text(0); } else if (totalUpCount > totalDownCount) { console.log(totalDownCount); console.log(totalUpCount); if (totalDownCount === 0) { upCount.text(curVotes + 1); largeCount.text(curVotes + 1); } else { upCount.text(curVotes + 2); largeCount.text(curVotes + 2); } } else { upCount.text(curVotes + 1); largeCount.text(curVotes + 1); } dislikes.toggleClass('down dislikes'); upCount.css('color', '#296394').hide().fadeIn(200); largeCount.hide().fadeIn(); } else { if (totalDownCount > totalUpCount) { upCount.text(0); largeCount.text(0); } else { // They clicked the up arrow and haven't voted up yet upCount.text(curVotes + 1); largeCount.text(curVotes + 1).hide().fadeIn(200); upCount.css('color', '#296394').hide().fadeIn(200); } } // Change arrow to dark blue if (isUp) { $that.toggleClass('up likes'); } } // Voted down on submission if (voteType === 'down') { var alreadyVotedDown = $that.hasClass('dislikes'), downCount = $that.prev('div.count'); // Get previous anchor attribute var likes = $that.prevAll('a').first(); if (alreadyVotedDown) { if (curVotes === 0) { if (totalDownCount > totalUp) { downCount.text(curVotes); largeCount.text(curVotes); } else { if (totalUpCount < totalDownCount || totalUpCount == totalDownCount) { downCount.text(0); largeCount.text(0); } else { downCount.text((totalUpCount - totalUpCount) + 1); largeCount.text((totalUpCount - totalUpCount) + 1); } } } else { downCount.text(curVotes + 1); largeCount.text(curVotes + 1); } $that.toggleClass('down dislikes'); downCount.css('color', '#555').hide().fadeIn(200); largeCount.hide().fadeIn(); } else if (likes.hasClass('likes')) { // They voted up from 0, and now are voting down if (curVotes <= 1) { downCount.text(0); largeCount.text(0); } else { // They voted up, now they are voting down (from a number > 0) downCount.text(curVotes - 2); largeCount.text(curVotes - 2); } likes.toggleClass('up likes'); downCount.css('color', '#ba2a2a').hide().fadeIn(200); largeCount.hide().fadeIn(200); } else { if (curVotes > 0) { downCount.text(curVotes - 1); largeCount.text(curVotes - 1); } else { downCount.text(curVotes); largeCount.text(curVotes); } downCount.css('color', '#ba2a2a').hide().fadeIn(200); largeCount.hide().fadeIn(200); } // Change the arrow to red if (isDown) { $that.toggleClass('down dislikes'); } } return false; }); });? Pretty convoluted, right? Is there a way to do something similar but in about 1/3 of the code I've written? After attempting to re-write it, I find myself doing the same thing so I just gave up halfway through and decided to ask for some help (fiddle of most recent).

    Read the article

  • C code won't compile

    - by cc
    Please help me to understand why the following code will not compile: #include <stdio.h> //#include <iostream> //using namespace std; int main(void){ int i,k,x,y,run,e,r,s,m,count=0; char numbers[19][19]; for(i=0;i<19;i++){ for (k=0;k<19;k++){ numbers[i][k]='.'; } } void drawB(){ printf(" 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 \n"); printf ("0 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[0][0],numbers[0][1],numbers[0][2],numbers[0][3],numbers[0][4], numbers[0][5],numbers[0][6],numbers[0][7],numbers[0][8],numbers[0][9], numbers[0][10],numbers[1][11],numbers[1][12],numbers[1][13],numbers[0][14] ,numbers[0][15],numbers[0][16],numbers[0][17],numbers[0][18]); printf ("1 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[1][0],numbers[1][1],numbers[1][2],numbers[1][3],numbers[1][4], numbers[1][5],numbers[1][6],numbers[1][7],numbers[1][8],numbers[1][9], numbers[1][10],numbers[1][11],numbers[1][12],numbers[1][13],numbers[1][14] ,numbers[1][15],numbers[1][16],numbers[1][17],numbers[1][18]); printf ("2 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" numbers[2][0],numbers[2][1],numbers[2][2],numbers[2][3],numbers[2][4], numbers[2][5],numbers[2][6],numbers[2][7],numbers[2][8],numbers[2][9], numbers[2][10],numbers[2][11],numbers[2][12],numbers[2][13],numbers[2][14] ,numbers[2][15],numbers[2][16],numbers[2][17],numbers[2][18]); printf ("3 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[3][0],numbers[3][1],numbers[3][2],numbers[3][3],numbers[3][4], numbers[3][5],numbers[3][6],numbers[3][7],numbers[3][8],numbers[3][9], numbers[3][10],numbers[3][11],numbers[3][12],numbers[3][13],numbers[3][14] ,numbers[3][15],numbers[3][16],numbers[3][17],numbers[3][18]); printf ("4 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[4][0],numbers[4][1],numbers[4][2],numbers[4][3],numbers[4][4], numbers[4][5],numbers[4][6],numbers[4][7],numbers[4][8],numbers[4][9], numbers[4][10],numbers[4][11],numbers[4][12],numbers[4][13],numbers[4][14] ,numbers[4][15],numbers[4][16],numbers[4][17],numbers[4][18]); printf ("5 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[5][0],numbers[5][1],numbers[5][2],numbers[5][3],numbers[5][4], numbers[5][5],numbers[5][6],numbers[5][7],numbers[5][8],numbers[5][9], numbers[5][10],numbers[5][11],numbers[5][12],numbers[5][13],numbers[5][14] ,numbers[5][15],numbers[5][16],numbers[5][17],numbers[5][18]); printf ("6 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[6][0],numbers[6][1],numbers[6][2],numbers[6][3],numbers[6][4], numbers[6][5],numbers[6][6],numbers[6][7],numbers[6][8],numbers[6][9], numbers[6][10],numbers[6][11],numbers[6][12],numbers[6][13],numbers[6][14] ,numbers[6][15],numbers[6][16],numbers[6][17],numbers[6][18]); printf ("7 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[7][0],numbers[7][1],numbers[7][2],numbers[7][3],numbers[7][4], numbers[7][5],numbers[7][6],numbers[7][7],numbers[7][8],numbers[7][9], numbers[7][10],numbers[7][11],numbers[7][12],numbers[7][13],numbers[7][14] ,numbers[7][15],numbers[7][16],numbers[7][17],numbers[7][18]); printf ("8 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[8][0],numbers[8][1],numbers[8][2],numbers[8][3],numbers[8][4], numbers[8][5],numbers[8][6],numbers[8][7],numbers[8][8],numbers[8][9], numbers[8][10],numbers[8][11],numbers[8][12],numbers[8][13],numbers[8][14] ,numbers[8][15],numbers[8][16],numbers[8][17],numbers[8][18]); printf ("9 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[9][0],numbers[9][1],numbers[9][2],numbers[9][3],numbers[9][4], numbers[9][5],numbers[9][6],numbers[9][7],numbers[9][8],numbers[9][9], numbers[9][10],numbers[9][11],numbers[9][12],numbers[9][13],numbers[9][14] ,numbers[9][15],numbers[9][16],numbers[9][17],numbers[9][18]); printf ("0 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[10][0],numbers[10][1],numbers[10][2],numbers[10][3],numbers[10][4], numbers[10][5],numbers[10][6],numbers[10][7],numbers[10][8],numbers[10][9], numbers[10][10],numbers[10][11],numbers[10][12],numbers[10][13],numbers[10][14] ,numbers[10][15],numbers[10][16],numbers[10][17],numbers[10][18]); printf ("1 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[11][0],numbers[11][1],numbers[11][2],numbers[11][3],numbers[11][4], numbers[11][5],numbers[11][6],numbers[11][7],numbers[11][8],numbers[11][9], numbers[11][10],numbers[11][11],numbers[11][12],numbers[11][13],numbers[11][14] ,numbers[11][15],numbers[11][16],numbers[11][17],numbers[11][18]); printf ("2 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[12][0],numbers[12][1],numbers[12][2],numbers[12][3],numbers[12][4], numbers[12][5],numbers[12][6],numbers[12][7],numbers[12][8],numbers[12][9], numbers[12][10],numbers[12][11],numbers[12][12],numbers[12][13],numbers[12][14] ,numbers[12][15],numbers[12][16],numbers[12][17],numbers[12][18]); printf ("3 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[13][0],numbers[13][1],numbers[13][2],numbers[13][3],numbers[13][4], numbers[13][5],numbers[13][6],numbers[13][7],numbers[13][8],numbers[13][9], numbers[13][10],numbers[13][11],numbers[13][12],numbers[13][13],numbers[13][14] ,numbers[13][15],numbers[13][16],numbers[13][17],numbers[13][18]); printf ("4 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[14][0],numbers[14][1],numbers[14][2],numbers[14][3],numbers[14][4], numbers[14][5],numbers[14][6],numbers[14][7],numbers[14][8],numbers[14][9], numbers[14][10],numbers[14][11],numbers[14][12],numbers[14][13],numbers[14][14] ,numbers[14][15],numbers[14][16],numbers[14][17],numbers[14][18]); printf ("5 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[15][0],numbers[15][1],numbers[15][2],numbers[15][3],numbers[15][4], numbers[15][5],numbers[15][6],numbers[15][7],numbers[15][8],numbers[15][9], numbers[15][10],numbers[15][11],numbers[15][12],numbers[15][13],numbers[15][14] ,numbers[15][15],numbers[15][16],numbers[15][17],numbers[15][18]); printf ("6 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[16][0],numbers[16][1],numbers[16][2],numbers[16][3],numbers[16][4], numbers[16][5],numbers[16][6],numbers[16][7],numbers[16][8],numbers[16][9], numbers[16][10],numbers[16][11],numbers[16][12],numbers[16][13],numbers[16][14] ,numbers[16][15],numbers[16][16],numbers[16][17],numbers[16][18]); printf ("7 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[17][0],numbers[17][1],numbers[17][2],numbers[17][3],numbers[17][4], numbers[17][5],numbers[17][6],numbers[17][7],numbers[17][8],numbers[17][9], numbers[17][10],numbers[17][11],numbers[17][12],numbers[17][13],numbers[17][14] ,numbers[17][15],numbers[17][16],numbers[17][17],numbers[17][18]); printf ("8 %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c %c \n\n" ,numbers[18][0],numbers[18][1],numbers[18][2],numbers[18][3],numbers[18][4], numbers[18][5],numbers[18][6],numbers[18][7],numbers[18][8],numbers[18][9], numbers[18][10],numbers[18][11],numbers[18][12],numbers[18][13],numbers[18][14] ,numbers[18][15],numbers[18][16],numbers[18][17],numbers[18][18]); } void checkSurrounded (int x,int y){ //numbers [x-1,y-1 ] , numbers [x-1,y ] , numbers [x-1,y+1 ] //numbers [x,y-1 ] , numbers [x,y ] , numbers [x,y+1 ] //numbers [x+1,y-1, ] , numbers [x+1,y ] , numbers [x+1,y+1 ] if(numbers[x][y]=='A'){ if((numbers[x-1][y-1]=='B') && (numbers[x-1][y]=='B') && (numbers[x-1][y+1]=='B') && (numbers[x][y-1]=='B') && (numbers[x][y+1]=='B') && (numbers[x+1][y-1]=='B') && (numbers[x+1][y]=='B')){ numbers[x][y]='B';} } if(numbers[x][y]=='B'){ if((numbers[x-1][y-1]=='A') && (numbers[x-1][y]=='A') && (numbers[x-1][y+1]=='A') && (numbers[x][y-1]=='A') && (numbers[x][y+1]=='A') && (numbers[x+1][y-1]=='A') && (numbers[x+1][y]=='A')){ numbers[x][y]='A'; } } } /** void checkArea(){ //detect enemy stone //store in array //find adjacent enemy stones // store the enemy stones in the array //keep on doing this until there are no more enemy stones that are adjacent for (s=0;s<19;s++) { for (m=0;m<19;m++) { if (numbers[s][m]=='A'){ count++; } } } }//end fn void checkAdjacent(int x, int y){ if (numbers [x][y]=='A'){ if((numbers[x][y-1]=='B' && numbers [x-1][y]=='B' && numbers[x][y+1]=='B' && numbers[x+1][y]=='B')){ } } } void getUserInput(){ int run=1; while(run){ printf("Enter x coordinate\n"); scanf("%d",&x); printf("Enter y coordinate\n"); scanf("%d",&y); if((x>18 || y>18 || x<0 || y<0) && !( numbers[x][y]=='.' )){ printf("invalid imput\n"); } else{ numbers[x][y]='B'; run=0; drawB(); } } } */ void getCupInput(){ //go through borad //starting from [0][0] //stop at first player stone //save as target x and target y //surround target x and target y //if already surrounded //start looking in borad again from last position //at end of board reset to [0][0] for(s=0;s<19;s++) { for(m=0;m<19;m++) { if (numbers[s][m]==0){ count++; } } } x=x-2; y=y+2; numbers[x][y]='A'; drawB(); } while(1){ //getUserInput(); getCupInput(); } system("pause"); return 0; }

    Read the article

  • Nginx and client certificates from hierarchical OpenSSL-based certification authorities

    - by Fmy Oen
    I'm trying to set up root certification authority, subordinate certification authority and to generate the client certificates signed by any of this CA that nginx 0.7.67 on Debian Squeeze will accept. My problem is that root CA signed client certificate works fine while subordinate CA signed one results in "400 Bad Request. The SSL certificate error". Step 1: nginx virtual host configuration: server { server_name test.local; access_log /var/log/nginx/test.access.log; listen 443 default ssl; keepalive_timeout 70; ssl_protocols SSLv3 TLSv1; ssl_ciphers AES128-SHA:AES256-SHA:RC4-SHA:DES-CBC3-SHA:RC4-MD5; ssl_certificate /etc/nginx/ssl/server.crt; ssl_certificate_key /etc/nginx/ssl/server.key; ssl_client_certificate /etc/nginx/ssl/client.pem; ssl_verify_client on; ssl_session_cache shared:SSL:10m; ssl_session_timeout 5m; location / { proxy_pass http://testsite.local/; } } Step 2: PKI infrastructure organization for both root and subordinate CA (based on this article): # mkdir ~/pki && cd ~/pki # mkdir rootCA subCA # cp -v /etc/ssl/openssl.cnf rootCA/ # cd rootCA/ # mkdir certs private crl newcerts; touch serial; echo 01 > serial; touch index.txt; touch crlnumber; echo 01 > crlnumber # cp -Rvp * ../subCA/ Almost no changes was made to rootCA/openssl.cnf: [ CA_default ] dir = . # Where everything is kept ... certificate = $dir/certs/rootca.crt # The CA certificate ... private_key = $dir/private/rootca.key # The private key and to subCA/openssl.cnf: [ CA_default ] dir = . # Where everything is kept ... certificate = $dir/certs/subca.crt # The CA certificate ... private_key = $dir/private/subca.key # The private key Step 3: Self-signed root CA certificate generation: # openssl genrsa -out ./private/rootca.key -des3 2048 # openssl req -x509 -new -key ./private/rootca.key -out certs/rootca.crt -config openssl.cnf Enter pass phrase for ./private/rootca.key: You are about to be asked to enter information that will be incorporated into your certificate request. What you are about to enter is what is called a Distinguished Name or a DN. There are quite a few fields but you can leave some blank For some fields there will be a default value, If you enter '.', the field will be left blank. ----- Country Name (2 letter code) [AU]: State or Province Name (full name) [Some-State]: Locality Name (eg, city) []: Organization Name (eg, company) [Internet Widgits Pty Ltd]: Organizational Unit Name (eg, section) []: Common Name (eg, YOUR name) []:rootca Email Address []: Step 4: Subordinate CA certificate generation: # cd ../subCA # openssl genrsa -out ./private/subca.key -des3 2048 # openssl req -new -key ./private/subca.key -out subca.csr -config openssl.cnf Enter pass phrase for ./private/subca.key: You are about to be asked to enter information that will be incorporated into your certificate request. What you are about to enter is what is called a Distinguished Name or a DN. There are quite a few fields but you can leave some blank For some fields there will be a default value, If you enter '.', the field will be left blank. ----- Country Name (2 letter code) [AU]: State or Province Name (full name) [Some-State]: Locality Name (eg, city) []: Organization Name (eg, company) [Internet Widgits Pty Ltd]: Organizational Unit Name (eg, section) []: Common Name (eg, YOUR name) []:subca Email Address []: Please enter the following 'extra' attributes to be sent with your certificate request A challenge password []: An optional company name []: Step 5: Subordinate CA certificate signing by root CA certificate: # cd ../rootCA/ # openssl ca -in ../subCA/subca.csr -extensions v3_ca -config openssl.cnf Using configuration from openssl.cnf Enter pass phrase for ./private/rootca.key: Check that the request matches the signature Signature ok Certificate Details: Serial Number: 1 (0x1) Validity Not Before: Feb 4 10:49:43 2013 GMT Not After : Feb 4 10:49:43 2014 GMT Subject: countryName = AU stateOrProvinceName = Some-State organizationName = Internet Widgits Pty Ltd commonName = subca X509v3 extensions: X509v3 Subject Key Identifier: C9:E2:AC:31:53:81:86:3F:CD:F8:3D:47:10:FC:E5:8E:C2:DA:A9:20 X509v3 Authority Key Identifier: keyid:E9:50:E6:BF:57:03:EA:6E:8F:21:23:86:BB:44:3D:9F:8F:4A:8B:F2 DirName:/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=rootca serial:9F:FB:56:66:8D:D3:8F:11 X509v3 Basic Constraints: CA:TRUE Certificate is to be certified until Feb 4 10:49:43 2014 GMT (365 days) Sign the certificate? [y/n]:y 1 out of 1 certificate requests certified, commit? [y/n]y ... # cd ../subCA/ # cp -v ../rootCA/newcerts/01.pem certs/subca.crt Step 6: Server certificate generation and signing by root CA (for nginx virtual host): # cd ../rootCA # openssl genrsa -out ./private/server.key -des3 2048 # openssl req -new -key ./private/server.key -out server.csr -config openssl.cnf Enter pass phrase for ./private/server.key: You are about to be asked to enter information that will be incorporated into your certificate request. What you are about to enter is what is called a Distinguished Name or a DN. There are quite a few fields but you can leave some blank For some fields there will be a default value, If you enter '.', the field will be left blank. ----- Country Name (2 letter code) [AU]: State or Province Name (full name) [Some-State]: Locality Name (eg, city) []: Organization Name (eg, company) [Internet Widgits Pty Ltd]: Organizational Unit Name (eg, section) []: Common Name (eg, YOUR name) []:test.local Email Address []: Please enter the following 'extra' attributes to be sent with your certificate request A challenge password []: An optional company name []: # openssl ca -in server.csr -out certs/server.crt -config openssl.cnf Step 7: Client #1 certificate generation and signing by root CA: # openssl genrsa -out ./private/client1.key -des3 2048 # openssl req -new -key ./private/client1.key -out client1.csr -config openssl.cnf Enter pass phrase for ./private/client1.key: You are about to be asked to enter information that will be incorporated into your certificate request. What you are about to enter is what is called a Distinguished Name or a DN. There are quite a few fields but you can leave some blank For some fields there will be a default value, If you enter '.', the field will be left blank. ----- Country Name (2 letter code) [AU]: State or Province Name (full name) [Some-State]: Locality Name (eg, city) []: Organization Name (eg, company) [Internet Widgits Pty Ltd]: Organizational Unit Name (eg, section) []: Common Name (eg, YOUR name) []:Client #1 Email Address []: Please enter the following 'extra' attributes to be sent with your certificate request A challenge password []: An optional company name []: # openssl ca -in client1.csr -out certs/client1.crt -config openssl.cnf Step 8: Client #1 certificate converting to PKCS12 format: # openssl pkcs12 -export -out certs/client1.p12 -inkey private/client1.key -in certs/client1.crt -certfile certs/rootca.crt Step 9: Client #2 certificate generation and signing by subordinate CA: # cd ../subCA/ # openssl genrsa -out ./private/client2.key -des3 2048 # openssl req -new -key ./private/client2.key -out client2.csr -config openssl.cnf Enter pass phrase for ./private/client2.key: You are about to be asked to enter information that will be incorporated into your certificate request. What you are about to enter is what is called a Distinguished Name or a DN. There are quite a few fields but you can leave some blank For some fields there will be a default value, If you enter '.', the field will be left blank. ----- Country Name (2 letter code) [AU]: State or Province Name (full name) [Some-State]: Locality Name (eg, city) []: Organization Name (eg, company) [Internet Widgits Pty Ltd]: Organizational Unit Name (eg, section) []: Common Name (eg, YOUR name) []:Client #2 Email Address []: Please enter the following 'extra' attributes to be sent with your certificate request A challenge password []: An optional company name []: # openssl ca -in client2.csr -out certs/client2.crt -config openssl.cnf Step 10: Client #2 certificate converting to PKCS12 format: # openssl pkcs12 -export -out certs/client2.p12 -inkey private/client2.key -in certs/client2.crt -certfile certs/subca.crt Step 11: Passing server certificate and private key to nginx (performed with OS superuser privileges): # cd ../rootCA/ # cp -v certs/server.crt /etc/nginx/ssl/ # cp -v private/server.key /etc/nginx/ssl/ Step 12: Passing root and subordinate CA certificates to nginx (performed with OS superuser privileges): # cat certs/rootca.crt > /etc/nginx/ssl/client.pem # cat ../subCA/certs/subca.crt >> /etc/nginx/ssl/client.pem client.pem file look like this: # cat /etc/nginx/ssl/client.pem -----BEGIN CERTIFICATE----- MIID6TCCAtGgAwIBAgIJAJ/7VmaN048RMA0GCSqGSIb3DQEBBQUAMFYxCzAJBgNV BAYTAkFVMRMwEQYDVQQIEwpTb21lLVN0YXRlMSEwHwYDVQQKExhJbnRlcm5ldCBX aWRnaXRzIFB0eSBMdGQxDzANBgNVBAMTBnJvb3RjYTAeFw0xMzAyMDQxMDM1NTda ... -----END CERTIFICATE----- Certificate: Data: Version: 3 (0x2) Serial Number: 1 (0x1) ... -----BEGIN CERTIFICATE----- MIID4DCCAsigAwIBAgIBATANBgkqhkiG9w0BAQUFADBWMQswCQYDVQQGEwJBVTET MBEGA1UECBMKU29tZS1TdGF0ZTEhMB8GA1UEChMYSW50ZXJuZXQgV2lkZ2l0cyBQ dHkgTHRkMQ8wDQYDVQQDEwZyb290Y2EwHhcNMTMwMjA0MTA0OTQzWhcNMTQwMjA0 ... -----END CERTIFICATE----- It looks like everything is working fine: # service nginx reload # Reloading nginx configuration: Enter PEM pass phrase: # nginx. # Step 13: Installing *.p12 certificates in browser (Firefox in my case) gives the problem I've mentioned above. Client #1 = 200 OK, Client #2 = 400 Bad request/The SSL certificate error. Any ideas what should I do? Update 1: Results of SSL connection test attempts: # openssl s_client -connect test.local:443 -CAfile ~/pki/rootCA/certs/rootca.crt -cert ~/pki/rootCA/certs/client1.crt -key ~/pki/rootCA/private/client1.key -showcerts Enter pass phrase for tmp/testcert/client1.key: CONNECTED(00000003) depth=1 C = AU, ST = Some-State, O = Internet Widgits Pty Ltd, CN = rootca verify return:1 depth=0 C = AU, ST = Some-State, O = Internet Widgits Pty Ltd, CN = test.local verify return:1 --- Certificate chain 0 s:/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=test.local i:/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=rootca -----BEGIN CERTIFICATE----- MIIDpjCCAo6gAwIBAgIBAjANBgkqhkiG9w0BAQUFADBWMQswCQYDVQQGEwJBVTET MBEGA1UECBMKU29tZS1TdGF0ZTEhMB8GA1UEChMYSW50ZXJuZXQgV2lkZ2l0cyBQ dHkgTHRkMQ8wDQYDVQQDEwZyb290Y2EwHhcNMTMwMjA0MTEwNjAzWhcNMTQwMjA0 ... -----END CERTIFICATE----- 1 s:/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=rootca i:/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=rootca -----BEGIN CERTIFICATE----- MIID6TCCAtGgAwIBAgIJAJ/7VmaN048RMA0GCSqGSIb3DQEBBQUAMFYxCzAJBgNV BAYTAkFVMRMwEQYDVQQIEwpTb21lLVN0YXRlMSEwHwYDVQQKExhJbnRlcm5ldCBX aWRnaXRzIFB0eSBMdGQxDzANBgNVBAMTBnJvb3RjYTAeFw0xMzAyMDQxMDM1NTda ... -----END CERTIFICATE----- --- Server certificate subject=/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=test.local issuer=/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=rootca --- Acceptable client certificate CA names /C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=rootca /C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=subca --- SSL handshake has read 3395 bytes and written 2779 bytes --- New, TLSv1/SSLv3, Cipher is AES256-SHA Server public key is 2048 bit Secure Renegotiation IS supported Compression: zlib compression Expansion: zlib compression SSL-Session: Protocol : TLSv1 Cipher : AES256-SHA Session-ID: 15BFC2029691262542FAE95A48078305E76EEE7D586400F8C4F7C516B0F9D967 Session-ID-ctx: Master-Key: 23246CF166E8F3900793F0A2561879E5DB07291F32E99591BA1CF53E6229491FEAE6858BFC9AACAF271D9C3706F139C7 Key-Arg : None PSK identity: None PSK identity hint: None SRP username: None TLS session ticket: 0000 - c2 5e 1d d2 b5 6d 40 23-b2 40 89 e4 35 75 70 07 .^...m@#[email protected]. 0010 - 1b bb 2b e6 e0 b5 ab 10-10 bf 46 6e aa 67 7f 58 ..+.......Fn.g.X 0020 - cf 0e 65 a4 67 5a 15 ba-aa 93 4e dd 3d 6e 73 4c ..e.gZ....N.=nsL 0030 - c5 56 f6 06 24 0f 48 e6-38 36 de f1 b5 31 c5 86 .V..$.H.86...1.. ... 0440 - 4c 53 39 e3 92 84 d2 d0-e5 e2 f5 8a 6a a8 86 b1 LS9.........j... Compression: 1 (zlib compression) Start Time: 1359989684 Timeout : 300 (sec) Verify return code: 0 (ok) --- Everything seems fine with Client #2 and root CA certificate but request returns 400 Bad Request error: # openssl s_client -connect test.local:443 -CAfile ~/pki/rootCA/certs/rootca.crt -cert ~/pki/subCA/certs/client2.crt -key ~/pki/subCA/private/client2.key -showcerts Enter pass phrase for tmp/testcert/client2.key: CONNECTED(00000003) depth=1 C = AU, ST = Some-State, O = Internet Widgits Pty Ltd, CN = rootca verify return:1 depth=0 C = AU, ST = Some-State, O = Internet Widgits Pty Ltd, CN = test.local verify return:1 ... Compression: 1 (zlib compression) Start Time: 1359989989 Timeout : 300 (sec) Verify return code: 0 (ok) --- GET / HTTP/1.0 HTTP/1.1 400 Bad Request Server: nginx/0.7.67 Date: Mon, 04 Feb 2013 15:00:43 GMT Content-Type: text/html Content-Length: 231 Connection: close <html> <head><title>400 The SSL certificate error</title></head> <body bgcolor="white"> <center><h1>400 Bad Request</h1></center> <center>The SSL certificate error</center> <hr><center>nginx/0.7.67</center> </body> </html> closed Verification fails with Client #2 certificate and subordinate CA certificate: # openssl s_client -connect test.local:443 -CAfile ~/pki/subCA/certs/subca.crt -cert ~/pki/subCA/certs/client2.crt -key ~/pki/subCA/private/client2.key -showcerts Enter pass phrase for tmp/testcert/client2.key: CONNECTED(00000003) depth=1 C = AU, ST = Some-State, O = Internet Widgits Pty Ltd, CN = rootca verify error:num=19:self signed certificate in certificate chain verify return:0 ... Compression: 1 (zlib compression) Start Time: 1359990354 Timeout : 300 (sec) Verify return code: 19 (self signed certificate in certificate chain) --- GET / HTTP/1.0 HTTP/1.1 400 Bad Request ... Still getting 400 Bad Request error with concatenated CA certificates and Client #2 (but still everything ok with Client #1): # cat certs/rootca.crt ../subCA/certs/subca.crt > certs/concatenatedca.crt # openssl s_client -connect test.local:443 -CAfile ~/pki/rootCA/certs/concatenatedca.crt -cert ~/pki/subCA/certs/client2.crt -key ~/pki/subCA/private/client2.key -showcerts Enter pass phrase for tmp/testcert/client2.key: CONNECTED(00000003) depth=1 C = AU, ST = Some-State, O = Internet Widgits Pty Ltd, CN = rootca verify return:1 depth=0 C = AU, ST = Some-State, O = Internet Widgits Pty Ltd, CN = test.local verify return:1 --- ... Compression: 1 (zlib compression) Start Time: 1359990772 Timeout : 300 (sec) Verify return code: 0 (ok) --- GET / HTTP/1.0 HTTP/1.1 400 Bad Request ... Update 2: I've managed to recompile nginx with enabled debug. Here is the part of successfull conection by Client #1 track: 2013/02/05 14:08:23 [debug] 38701#0: *119 accept: <MY IP ADDRESS> fd:3 2013/02/05 14:08:23 [debug] 38701#0: *119 event timer add: 3: 60000:2856497512 2013/02/05 14:08:23 [debug] 38701#0: *119 kevent set event: 3: ft:-1 fl:0025 2013/02/05 14:08:23 [debug] 38701#0: *119 malloc: 28805200:660 2013/02/05 14:08:23 [debug] 38701#0: *119 malloc: 28834400:1024 2013/02/05 14:08:23 [debug] 38701#0: *119 posix_memalign: 28860000:4096 @16 2013/02/05 14:08:23 [debug] 38701#0: *119 http check ssl handshake 2013/02/05 14:08:23 [debug] 38701#0: *119 https ssl handshake: 0x16 2013/02/05 14:08:23 [debug] 38701#0: *119 SSL server name: "test.local" 2013/02/05 14:08:23 [debug] 38701#0: *119 SSL_do_handshake: -1 2013/02/05 14:08:23 [debug] 38701#0: *119 SSL_get_error: 2 2013/02/05 14:08:23 [debug] 38701#0: *119 SSL handshake handler: 0 2013/02/05 14:08:23 [debug] 38701#0: *119 verify:1, error:0, depth:1, subject:"/C=AU /ST=Some-State/O=Internet Widgits Pty Ltd/CN=rootca",issuer: "/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=rootca" 2013/02/05 14:08:23 [debug] 38701#0: *119 verify:1, error:0, depth:0, subject:"/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=Client #1",issuer: "/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=rootca" 2013/02/05 14:08:23 [debug] 38701#0: *119 SSL_do_handshake: 1 2013/02/05 14:08:23 [debug] 38701#0: *119 SSL: TLSv1, cipher: "AES256-SHA SSLv3 Kx=RSA Au=RSA Enc=AES(256) Mac=SHA1" 2013/02/05 14:08:23 [debug] 38701#0: *119 http process request line 2013/02/05 14:08:23 [debug] 38701#0: *119 SSL_read: -1 2013/02/05 14:08:23 [debug] 38701#0: *119 SSL_get_error: 2 2013/02/05 14:08:23 [debug] 38701#0: *119 http process request line 2013/02/05 14:08:23 [debug] 38701#0: *119 SSL_read: 1 2013/02/05 14:08:23 [debug] 38701#0: *119 SSL_read: 524 2013/02/05 14:08:23 [debug] 38701#0: *119 SSL_read: -1 2013/02/05 14:08:23 [debug] 38701#0: *119 SSL_get_error: 2 2013/02/05 14:08:23 [debug] 38701#0: *119 http request line: "GET / HTTP/1.1" And here is the part of unsuccessfull conection by Client #2 track: 2013/02/05 13:51:34 [debug] 38701#0: *112 accept: <MY_IP_ADDRESS> fd:3 2013/02/05 13:51:34 [debug] 38701#0: *112 event timer add: 3: 60000:2855488975 2013/02/05 13:51:34 [debug] 38701#0: *112 kevent set event: 3: ft:-1 fl:0025 2013/02/05 13:51:34 [debug] 38701#0: *112 malloc: 28805200:660 2013/02/05 13:51:34 [debug] 38701#0: *112 malloc: 28834400:1024 2013/02/05 13:51:34 [debug] 38701#0: *112 posix_memalign: 28860000:4096 @16 2013/02/05 13:51:34 [debug] 38701#0: *112 http check ssl handshake 2013/02/05 13:51:34 [debug] 38701#0: *112 https ssl handshake: 0x16 2013/02/05 13:51:34 [debug] 38701#0: *112 SSL server name: "test.local" 2013/02/05 13:51:34 [debug] 38701#0: *112 SSL_do_handshake: -1 2013/02/05 13:51:34 [debug] 38701#0: *112 SSL_get_error: 2 2013/02/05 13:51:34 [debug] 38701#0: *112 SSL handshake handler: 0 2013/02/05 13:51:34 [debug] 38701#0: *112 SSL_do_handshake: -1 2013/02/05 13:51:34 [debug] 38701#0: *112 SSL_get_error: 2 2013/02/05 13:51:34 [debug] 38701#0: *112 SSL handshake handler: 0 2013/02/05 13:51:34 [debug] 38701#0: *112 verify:0, error:20, depth:1, subject:"/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=subca",issuer: "/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=rootca" 2013/02/05 13:51:34 [debug] 38701#0: *112 verify:0, error:27, depth:1, subject:"/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=subca",issuer: "/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=rootca" 2013/02/05 13:51:34 [debug] 38701#0: *112 verify:1, error:27, depth:0, subject:"/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=Client #2",issuer: "/C=AU/ST=Some-State/O=Internet Widgits Pty Ltd/CN=subca" 2013/02/05 13:51:34 [debug] 38701#0: *112 SSL_do_handshake: 1 2013/02/05 13:51:34 [debug] 38701#0: *112 SSL: TLSv1, cipher: "AES256-SHA SSLv3 Kx=RSA Au=RSA Enc=AES(256) Mac=SHA1" 2013/02/05 13:51:34 [debug] 38701#0: *112 http process request line 2013/02/05 13:51:34 [debug] 38701#0: *112 SSL_read: 1 2013/02/05 13:51:34 [debug] 38701#0: *112 SSL_read: 524 2013/02/05 13:51:34 [debug] 38701#0: *112 SSL_read: -1 2013/02/05 13:51:34 [debug] 38701#0: *112 SSL_get_error: 2 2013/02/05 13:51:34 [debug] 38701#0: *112 http request line: "GET / HTTP/1.1" So I'm getting OpenSSL error #20 and then #27. According to verify documentation: 20 X509_V_ERR_UNABLE_TO_GET_ISSUER_CERT_LOCALLY: unable to get local issuer certificate the issuer certificate could not be found: this occurs if the issuer certificate of an untrusted certificate cannot be found. 27 X509_V_ERR_CERT_UNTRUSTED: certificate not trusted the root CA is not marked as trusted for the specified purpose.

    Read the article

< Previous Page | 28 29 30 31 32 33  | Next Page >