Search Results

Search found 25798 results on 1032 pages for 'jquery validation plugin'.

Page 33/1032 | < Previous Page | 29 30 31 32 33 34 35 36 37 38 39 40  | Next Page >

  • Tiny MCE (jquery plugin version) not showing toolbar in IE (works fine in other browsers)

    - by I am Wonder
    I had an implementation working well but for some reason IE decided it was tired of playing nice. I have an advanced implementation of TinyMCE (the jquery plugin version - see http://tinymce.moxiecode.com/examples/example_23.php for details). It still works great in all browsers but IE. In IE it shows the drop-down options for Format, Font family, and Font size, but only as text.. not as a drop down normally looks. All other buttons on the toolbar are missing. (I've tried IE8 and IE8 Compatibility Mode) I get a javascript error: Syntax error Line 36 Char 1. Unfortunately the javascript is being loaded dynamically so this doesn't help me. Here is my implementation code for the TinyMCE editor: $(function () { $('#InputStuffHere').tinymce({ // General options theme: "advanced", plugins: "safari,pagebreak,style,layer,table,save,advhr,advimage,advlink,inlinepopups,preview,media,searchreplace,contextmenu,paste,fullscreen,noneditable,visualchars,nonbreaking,template", // Theme options theme_advanced_buttons1: "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,formatselect,fontselect,fontsizeselect,|,hr,removeformat", theme_advanced_buttons2: "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,image,|,forecolor,backcolor,|,spellchecker", theme_advanced_buttons3 : "", theme_advanced_toolbar_location: "top", theme_advanced_toolbar_align: "left", theme_advanced_statusbar_location: "bottom", theme_advanced_resizing: true, // Drop lists for link/image/media/template dialogs template_external_list_url: "lists/template_list.js", external_link_list_url: "lists/link_list.js", external_image_list_url: "lists/image_list.js", media_external_list_url: "lists/media_list.js", //initialization callback init_instance_callback: "TinyMCEReady", add_form_submit_trigger : false }); }); So... anyone seen anything like this or have any ideas for me? Thank you so much everyone!

    Read the article

  • jQuery .each() with multiple selectors - skip, then .empty() elements

    - by joe
    I'd like to remove all matching elements, but skip the first instance of each match: // Works as expected: removes all but first instance of .a jQuery ('.a', '#scope') .each ( function (i) { if (i > 0) jQuery (this).empty(); }); // Expected: removal of all but first instance of .a and .b // Result: removal of *all* instances of both .a and .b jQuery ('.a, .b', '#scope') .each ( function (i) { if (i > 1) jQuery (this).empty(); }); <div id="scope"> <!-- Want to keep the first instance of .a and .b --> <div class="a">[bla]</span> <div class="b">[bla]</span> <!-- Want to remove all the others --> <div class="a">[bla]</span> <div class="b">[bla]</span <div class="a">[bla]</span> <div class="b">[bla]</span ... </div> Any suggestions? Using jQuery() rather than $() because of conflict with 'legacy' code Using .empty() because .a contains JS I'd like to disable Stuck with jQuery 1.2.3 Thanks you!

    Read the article

  • jQuery Bounce ignores positioning

    - by ashansky
    I'm having a problem trying to use the jQuery effect "bounce" on an absolutely position div inside of a relatively positioned div. The #Bounce div is positioned to be slightly above the container div and when a certain message is received it is supposed to bounce on top of it. But what ends up happening is that the #bounce div drops down into the container div and bounces inside of it till it stops and then correctly repositions itself on top of the container div. This same code is working in Firefox but doesn't seem to be working in Webkit or IE. Can anyone help me understand why this is happening? if (jQuery("#Bounce").data("bouncing") == false || jQuery("#Bounce").data("bouncing") == undefined) { jQuery("#Bounce").show().effect("bounce",{times:10,distance:50},300,function(){jQuery("#Bounce").data("bouncing", false);}); jQuery("#Bounce").data("bouncing", true); } <div id="Container" style="height: 28px; float: right; position: relative; top: 2px; cursor: pointer; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 3px; "> ... <div id="Bounce" style="bottom: 28px; right: 0px; height: 26px; width: 26px; z-index: 989; display: none; position: absolute; ">...</div> </div>

    Read the article

  • Jquery Autocomplete plugin with Django (Trey Piepmeier solution)

    - by Sally
    So, I'm basing my code on Trey's solution on: http://solutions.treypiepmeier.com/2009/12/10/using-jquery-autocomplete-with-django/ The script is: <script> $(function() { $('#id_members').autocomplete('{{ object.get_absolute_url }}members/lookup', { dataType: 'json', width: 200, parse: function(data) { return $.map(data, function(row) { return { data:row, value:row[1], result:row[0] }; }); } }).result( function(e, data, value) { $("#id_members_pk").val(value); } ); } ); </script> The views.py: def members_lookup(request, pid): results = [] if request.method == "GET": if request.GET.has_key(u'q'): value = request.GET[u'q'] # Ignore queries shorter than length 1 if len(value) > 2: model_results = Member.objects.filter( Q(user__first_name__icontains=value) | Q(user__last_name__icontains=value) ) results = [ (x.user.get_full_name(), x.id) for x in model_results ] json = simplejson.dumps(results) print json return HttpResponse(json, mimetype='application/json') The problem is: It stops refining the search results after the initial lookup. For example: If I set len(value) 2, after I type the 3rd character it will give me a list of suggestions. But if I keep on typing the 4th or 5th character, the list of suggestions doesn't change. Any suggestions on why this is?

    Read the article

  • Jquery AutoComplete Plugin calling

    - by martinezgeovani
    When I use JQuery's autocomplete and hardcode the array values in the page it works wonderful; but what I need to do is obtain the array values from either a web service or from a public function inside a controller. I have tried various way and can't seem to make it work. The farthest I got is pulling the data in to a long string and when the auto complete results are provided it's the long string which matches, which I understand why. $("#TaskEmailNotificationList").autocomplete("http://localhost/BetterTaskList/Accounts/registeredUsersEmailList", { multiple: true, mustMatch: false, multipleSeparator: ";", autoFill: true }); has anyone encountered this? I am using C#. UPDATE: The below code is a step forward I am now getting an array returned but I think I'm processing it wrong on my page. var emailList = "http://localhost/BetterTaskList/Account/RegisteredUsersEmailList"; $("#TaskEmailNotificationList").autocomplete(emailList, { multiple: true, mustMatch: false, multipleSeparator: ";", autoFill: true }); [HttpGet] public ActionResult RegisteredUsersEmailList() { BetterTaskListDataContext db = new BetterTaskListDataContext(); var emailList = from u in db.Users select u.LoweredUserName; return Json(emailList.ToList(), JsonRequestBehavior.AllowGet); }

    Read the article

  • Jrails and jquery-rails together?

    - by ecoologic
    I hope you forgive me if I'm a little confused about this. Jrails rewrites all the helper methods for rjs otherwise in prototype. Jquery-rails overrides rails.js (so I taught the rjs helpers as well, but I see it's not) and the rest of the libraries in jquery instead of prototype. Does it means that with just Jquery-rails I can't use rjs at all? Then do these gems work well together and let me completely forget prototype? Is there any disadvantage in using them together? I read some complaining about the fact that jrails uses jq 1.5 and now there is 1.8, but jquery-rails gives me the last version (is there retro compatibility?), but how will this affect my development (using both the gems together)? I mean have you got some examples of jquery-ui plugins I can't use or I could have problems with? Any help is appreciated. Don't get me wrong, I'm not against prototype, just I keep on having conflicts over conflicts using both of them, and I have to chose I pick Jquery.

    Read the article

  • jQuery Cycle plugin IE6/7 issues

    - by Aaron Moodie
    I've implemented a slideshow using the Cycle plugin, which is working in all browsers except IE6&7, where the images just show up in a list, and the #page_copy div is not hiding. I've been going through the code all day without any luck, and not exactly sure how or what I should be looking for. What would be the best way to go about debugging this issue? I know that the #page_copy div is hiding when I remove the rest of the code, and I've tried the reverse (which had no result) <script type="text/javascript" charset="utf-8"> jQuery.fn.fadeToggle = function(speed, easing, callback) { return this.animate({opacity: 'toggle'}, speed, easing, callback); }; $(document).ready(function() { $('#page_copy').hide(); $('a#info_close_button').click(function() { $('#page_copy').fadeOut(200); return false; }); $('a#info_button').click(function() { $('#page_copy').fadeToggle(200); return false; }); }); $(window).load(function() { // vertically center single image var $image_cnt = $("#images > img").size(); if($image_cnt < 2) { var $single_img = $("#images").children(':first-child'); var h = $single_img.height(); $single_img.css({ marginTop: (620 - h) / 2, }); $(".next").css("display","none"); $(".prev").css("display","none"); } }); // wait until images have loaded before starting cycle $(window).load(function() { // front image rotator $('#images').cycle({ fx: 'fade', speed: 300, next: '.next', prev: '.prev', containerResize: 0, timeout: 0, delay: -2000, before: onBefore }); }); // hide all but the first image when page loads $(document).ready(function() { $('#images img:gt(0)').hide(); }); // callback fired when each slide transition begins function onBefore(curr,next,opts) { var $slide = $(next); var w = $slide.width(); var h = $slide.height(); $slide.css({ marginTop: (620 - h) / 2, marginLeft: (650 - w) / 2 }); }; </script>

    Read the article

  • Jquery Cycle Plugin Question - turning off relative links to photos so it goes to a URL

    - by alpdog14
    I am using Jquery Cycle Plugin and it has a side panel that highlights as the photos change and currently when I click on the text the associated photo pulls up then I have to click on the photo to go to the URL but I would like the text itself to link to the URL. I have looked at the fn.cycle.defaults but not sure what to change and I tried a few things but nothing works. If anyone can help me figure this out it would be most helpful. Here are the fn.cycle.defaults: fx: 'fade', // one of: fade, shuffle, zoom, scrollLeft, etc timeout: 4000, // milliseconds between slide transitions (0 to disable auto advance) continuous: 0, // true to start next transition immediately after current one completes speed: 1000, // speed of the transition (any valid fx speed value) speedIn: null, // speed of the 'in' transition speedOut: null, // speed of the 'out' transition next: null, // id of element to use as click trigger for next slide prev: null, // id of element to use as click trigger for previous slide prevNextClick: null, // callback fn for prev/next clicks: function(isNext, zeroBasedSlideIndex, slideElement) pager: null, // id of element to use as pager container pagerClick: null, // callback fn for pager clicks: function(zeroBasedSlideIndex, slideElement) pagerEvent: null, // event which drives the pager navigation pagerAnchorBuilder: null, // callback fn for building anchor links before: null, // transition callback (scope set to element to be shown) after: null, // transition callback (scope set to element that was shown) end: null, // callback invoked when the slideshow terminates (use with autostop or nowrap options) easing: null, // easing method for both in and out transitions easeIn: null, // easing for "in" transition easeOut: null, // easing for "out" transition shuffle: null, // coords for shuffle animation, ex: { top:15, left: 200 } animIn: null, // properties that define how the slide animates in animOut: null, // properties that define how the slide animates out cssBefore: null, // properties that define the initial state of the slide before transitioning in cssAfter: null, // properties that defined the state of the slide after transitioning out fxFn: null, // function used to control the transition height: 'auto', // container height startingSlide: 0, // zero-based index of the first slide to be displayed sync: 1, // true if in/out transitions should occur simultaneously random: 0, // true for random, false for sequence (not applicable to shuffle fx) fit: 0, // force slides to fit container pause: true, // true to enable "pause on hover" autostop: 0, // true to end slideshow after X transitions (where X == slide count) autostopCount: 0, // number of transitions (optionally used with autostop to define X) delay: 0, // additional delay (in ms) for first transition (hint: can be negative) slideExpr: null, // expression for selecting slides (if something other than all children is required) cleartype: 0, // true if clearType corrections should be applied (for IE) nowrap: 0 // true to prevent slideshow from wrapping }; I have tried changing the pageClick and pagerEvent but nothing seems to be working. Please help!!!

    Read the article

  • How to perform duplicate key validation using entlib (or DataAnnotations), MVC, and Repository pattern

    - by olivehour
    I have a set of ASP.NET 4 projects that culminate in an MVC (3 RC2) app. The solution uses Unity and EntLib Validation for cross-cutting dependency injection and validation. Both are working great for injecting repository and service layer implementations. However, I can't figure out how to do duplicate key validation. For example, when a user registers, we want to make sure they don't pick a UserID that someone else is already using. For this type of validation, the validating object must have a repository reference... or some other way to get an IQueryable / IEnumerable reference to check against other rows already in the DB. What I have is a UserMetadata class that has all of the property setters and getters for a user, along with all of the appropriate DataAnnotations and EntLib Validation attributes. There is also a UserEntity class implemented using EF4 POCO Entity Generator templates. The UserEntity depends on UserMetadata, because it has a MetadataTypeAttribute. I also have a UserViewModel class that has the same exact MetadataType attribute. This way, I can apply the same validation rules, via attributes, to both the entity and viewmodel. There are no concrete references to the Repository classes whatsoever. All repositories are injected using Unity. There is also a service layer that gets dependency injection. In the MVC project, service layer implementation classes are injected into the Controller classes (the controller classes only contain service layer interface references). Unity then injects the Repository implementations into the service layer classes (service classes also only contain interface references). I've experimented with the DataAnnotations CustomValidationAttribute in the metadata class. The problem with this is the validation method must be static, and the method cannot instantiate a repository implementation directly. My repository interface is IRepository, and I have only one single repository implementation class defined as EntityRepository for all domain objects. To instantiate a repository explicitly I would need to say new EntityRepository(), which would result in a circular dependency graph: UserMetadata [depends on] DuplicateUserIDValidator [depends on] UserEntity [depends on] UserMetadata. I've also tried creating a custom EntLib Validator along with a custom validation attribute. Here I don't have the same problem with a static method. I think I could get this to work if I could just figure out how to make Unity inject my EntityRepository into the validator class... which I can't. Right now, all of the validation code is in my Metadata class library, since that's where the custom validation attribute would go. Any ideas on how to perform validations that need to check against the current repository state? Can Unity be used to inject a dependency into a lower-layer class library?

    Read the article

  • Play Framework custom validation errors with multiple String parameters

    - by Mark
    I'm trying to set a custom validation error with multiple params in Play!, but it seems like my validation parameters are not rendered correctly. I have defined in messages: validation.customerror=This is first param "%s", and this is the second "%s" The in my code I execute: validation.addError("","validation.customerror", "FIRST", "SECOND"); And I get: This is first param "", and this is the second "FIRST" Thoughts?

    Read the article

  • Effective Data Validation

    - by John Conde
    What's an effective way to handle data validation, say, from a form submission? Originally I had a bunch of if statements that checked each value and collected invalid values in an array for later retrieval (and listing). // Store errors here $errors = array(); // Hypothetical check if a string is alphanumeric if (!preg_match('/^[a-z\d]+$/i', $fieldvalue)) { $errors[$fieldname] = 'Please only use letters and numbers for your street address'; } // etc... What I did next was create a class that handles various data validation scenarios and store the results in an internal array. After data validation was complete I would check to see if any errors occurred and handle accordingly: class Validation { private $errorList = array(); public function isAlphaNumeric($string, $field, $msg = '') { if (!preg_match('/^[a-z\d]+$/i', $string)) { $this->errorList[$field] = $msg; } } // more methods here public function creditCard($cardNumber, $field, $msg = '') { // Validate credit card number } // more methods here public function hasErrors() { return count($this->errorList); } } /* Client code */ $validate = new Validation(); $validate->isAlphaNumeric($fieldvalue1, $fieldname1, 'Please only use letters and numbers for your street address'); $validate->creditCard($fieldvalue2, $fieldname2, 'Please enter a valid credit card number'); if ($validate->hasErrors()) { // Handle as appropriate } Naturally it didn't take long before this class became bloated with the virtually unlimited types of data to be validated. What I'm doing now is using decorators to separate the different types of data into their own classes and call them only when needed leaving generic validations (i.e. isAlphaNumeric()) in the base class: class Validation { private $errorList = array(); public function isAlphaNumeric($string, $field, $msg = '') { if (!preg_match('/^[a-z\d]+$/i', $string)) { $this->errorList[$field] = $msg; } } // more generic methods here public function setError($field, $msg = '') { $this->errorList[$field] = $msg; } public function hasErrors() { return count($this->errorList); } } class ValidationCreditCard { protected $validate; public function __construct(Validation $validate) { $this->validate = $validate; } public function creditCard($cardNumber, $field, $msg = '') { // Do validation // ... // if there is an error $this->validate->setError($field, $msg); } // more methods here } /* Client code */ $validate = new Validation(); $validate->isAlphaNumeric($fieldvalue, $fieldname, 'Please only use letters and numbers for your street address'); $validateCC = new ValidationCreditCard($validate); $validateCC->creditCard($fieldvalue2, $fieldname2, 'Please enter a valid credit card number'); if ($validate->hasErrors()) { // Handle as appropriate } Am I on the right track? Or did I just complicate data validation more then I needed to?

    Read the article

  • Microsoft, jQuery, and Templating

    - by Stephen Walther
    About two months ago, John Resig and I met at Café Algiers in Harvard square to discuss how Microsoft can contribute to the jQuery project. Today, Scott Guthrie announced in his second-day MIX keynote that Microsoft is throwing its weight behind jQuery and making it the primary way to develop client-side Ajax applications using Microsoft technologies. What does this announcement mean? It means that Microsoft is shifting its resources to invest in jQuery. Developers on the ASP.NET team are now working full-time to contribute features to the core jQuery library. Furthermore, we are working with other teams at Microsoft to ensure that our technologies work great with jQuery. We are contributing to the open-source jQuery project in the exact same way that any other company or individual from the community can contribute to jQuery. We are writing proposals, submitting the proposals to the jQuery forums, and revising the proposals in response to community feedback. The jQuery team can decide to reject or accept any feature that we propose. Any feature that Microsoft contributes to jQuery will be platform neutral. In other words, Microsoft contributions will benefit PHP and RAILS developers just as much as they benefit ASP.NET developers. Microsoft contributions to jQuery will improve the web for everyone. Contributing Support for Templates to jQuery Core Our first proposal concerns templating. We want to contribute support for templates to jQuery so that JavaScript developers can use jQuery to easily display a set of database records. You can read our templating proposal here: http://wiki.github.com/nje/jquery/jquery-templates-proposal You can download and play with our prototype for templating here: http://github.com/nje/jquery-tmpl The following code illustrates how you can use a template to display a set of products in a bulleted list: <script type="text/javascript"> jQuery(function(){ var products = [ { name: "Product 1", price: 12.99}, { name: "Product 2", price: 9.99}, { name: "Product 3", price: 35.59} ]; $("ul").append("#template", products); }); </script> <script id="template" type="text/html"> <li>{%= name %} - {%= price %}</li> </script> <ul></ul> The template is contained in a SCRIPT element that has a TYPE=”text/html” attribute. Browsers ignore the contents of a SCRIPT element when they don’t understand the content type. Notice that the placeholder {%=...%} is used within the template to indicate where the name and price of a product should appear. The delimiters {%=…%} are used for expressions and the delimiters {%...%} are used for code. Finally, the products are rendered using the template with the call to $(“ul”).append(“#template”, products). The standard jQuery DOM manipulation methods have been modified to support templates. When the page above is rendered, you get the bulleted list displayed in the following figure. Our goal is to keep our proposal for templates as simple as possible. After support for templating has been added to jQuery, plug-in authors can take advantage of templating when building complex data-driven plug-ins such as a DataGrid plug-in. The Ajax Control Toolkit Over 100,000 developers download the Ajax Control Toolkit every month. That’s a mind-boggling number of downloads. We realize that the Ajax Control Toolkit is extremely popular among ASP.NET Web Forms developers and we want to continue to invest in the Ajax Control Toolkit. If you are adding JavaScript interactivity to an ASP.NET Web Forms application, and you don’t want to write JavaScript, then we recommend that you use the server controls in the Ajax Control Toolkit. Using the Ajax Control Toolkit does not require knowledge of JavaScript and the toolkit enables you to build applications with the concepts familiar to ASP.NET Web Forms applications developers. If, however, you are interested in creating client-side interactivity without server controls then we recommend that you use jQuery. We plan to continue to release new versions of the Ajax Control Toolkit every few months. Our goal is to continue to improve the quality of the Ajax Control Toolkit and to make it easier for the community to contribute code, bug fixes, and documentation. The ASP.NET Ajax Library We are moving the ASP.NET Ajax Library into the Ajax Control Toolkit. If you currently use ASP.NET Ajax Library client templates, client data-binding, or the client script loader then you can continue to use these features by downloading the Ajax Control Toolkit. Be aware that our focus with the Ajax Control Toolkit is server-side Ajax.  For client-side Ajax, we are shifting our focus to jQuery. For example, if you have been using ASP.NET Ajax Library client templates then we recommend that you shift to using jQuery instead. Conclusion Our plan is to focus on jQuery as the primary technology for building client-side Ajax applications moving forward. We want to adapt Microsoft technologies to work great with jQuery and we want to contribute features to jQuery that will make the web better for everyone. We are very excited to be working with the jQuery core team.

    Read the article

  • jQuery Drag And Drop Using Live Events

    - by devongovett
    Hello. I have an application with a long list that changes frequently, and I need this the items of this list to be draggable. I've been using the jQuery UI draggable plugin, but it is slow to add to 400+ list items, and has to be re-added every time new list items are added. Does anyone know of a plugin similar to the jQuery UI draggable plugin that uses jQuery 1.3's .live() events? This would solve both problems. Thanks!

    Read the article

  • Resizing text in an HTML 5 page using JQuery

    - by nikolaosk
    This is going to be the ninth post in a series of posts regarding HTML 5. You can find the other posts here, here , here , here, here , here , here and here.In this post I will demonstrate how to implement a very common feature found in websites today, enabling the visitor to increase or decrease the font size of a page. You can use the JQuery code I will write in this post for HTML pages which do not follow the HTML 5 standard. As I said earlier we need to write JavaScript to implement this functionality.I will use the very popular JQuery Library. Please download the library (minified version) from http://jquery.com/downloadIn this hands-on example I will be using Expression Web 4.0.This application is not a free application. You can use any HTML editor you like.You can use Visual Studio 2012 Express edition. You can download it here. The HTML markup for the page follows. <!DOCTYPE html><html lang="en">  <head>    <title>HTML 5, CSS3 and JQuery</title>        <meta http-equiv="Content-Type" content="text/html;charset=utf-8" >    <link rel="stylesheet" type="text/css" href="style.css">     <script type="text/javascript" src="jquery-1.8.2.min.js">        </script><script type="text/javascript">$(function() {    $('a').click(function() {        var getfont = $('p').css('font-size');        var mynum = parseFloat(getfont, 10);        var newmwasure = getfont.slice(-2);                $('p').css('font-size', mynum / 1.2 + newmwasure);                if(this.id == 'increase') {            $('p').css('font-size', mynum * 1.4 + newmwasure);        }     })    })</script>       </head>  <body>      <div id="header">      <h1>Learn cutting edge technologies</h1>      <h2>HTML 5, JQuery, CSS3</h2>    </div>    <div id="resize">    <a href="" id="increase">Increase Font</a>       |        <a href="" id="decrease">Decrease Font</a>        </div>        <div id="main">          <h2>HTML 5</h2>                        <article>          <p>            HTML5 is the latest version of HTML and XHTML. The HTML standard defines a single language that can be written in HTML and XML. It attempts to solve issues found in previous iterations of HTML and addresses the needs of Web Applications, an area previously not adequately covered by HTML.          </p>          </article>      </div>             </body>  </html>  There is nothing difficult or fancy in the HTML markup above. I have a link to the external JQuery library and the JQuery code is included inside the .html page.I have two links on this page that will increase/decrease the font size of the contents enclosed inside the <p></p> tags.Let me explain what the JQuery code does.When the user clicks on the link, I store in a variable the current font size of the <p> element that I get back from the CSS function. var getfont = $('p').css('font-size'); So now we have the original value. That will return a value like "16px" "1.2em".Then I need to get the unit of measurement (px,em).I use the slice() function. var newmwasure = getfont.slice(-2); Then I want to get only the numeric part of the returning value.I do that using the parseFloat() function.Have a look at the parseFloat() function.Finally with this bit of code I choose a ratio (I am devising a very simple algorithm for increasing and decreasing) and apply it to the <p> element. I still use the CSS function. You can get but also set the font size for a particular element with the CSS function.So I check for the id=increase and if this matches I will increase the font size of the <p> element.If it does not match we will decrease the font size.   $('p').css('font-size', mynum / 1.2 + newmwasure);                if(this.id == 'increase') {            $('p').css('font-size', mynum * 1.4 + newmwasure);  The code for the css file (style.css) followsbody{background-color:#eaeaea;}p{font-size:0.8em;font-family:Tahoma;}#resize{width:200px;background-color:#dadada;}#resize a {text-decoration:none;}The above CSS rules are very easy to understand. Now I save all my work.I view my page on the browser for the first time.Have a look at the picture below Now I increase the font size by clicking the respective linkHave a look at the picture below  Finally I decrease the font size by clicking on the respective linkHave a look at the picture below   Once more we see that the power and simplicity of JQuery library enables us to write less code but accomplish a lot at the same time. Hope it helps!!  

    Read the article

  • jQuery Cycle Plugin - Content not cycling

    - by fmz
    I am setting up a page with jQuery's Cycle plugin and have four divs set to fade. I have the code in place, the images set, but it doesn't cycle properly. Firefox says there is a problem with the following code: <script type="text/javascript"> $(document).ready(function() { $('.slideshow').cycle({ fx: 'fade' }); }); </script> Here is the html: <div class="slideshow"> <div id="mainImg-1" class="slide"> <div class="quote"> <h2>Building Big Relationships with Small Business.</h2> <p>&ldquo;This is quote Number One.<br /> They are there when I need them the most.&rdquo;</p> <p><span class="author">Jane Doe &ndash; Charlotte Flower Shop</span></p> <div class="help"><a href="cb_services.html">Let Us Help You</a></div> </div> </div> <div id="mainImg-2" class="slide"> <div class="quote"> <h2>Building Big Relationships with Small Business.</h2> <p>&ldquo;This is quote Number Two.<br /> They are there when I need them the most.&rdquo;</p> <p><span class="author">Jane Doe &ndash; Charlotte Flower Shop</span></p> <div class="help"><a href="cb_services.html">Let Us Help You</a></div> </div> </div> <div id="mainImg-3" class="slide"> <div class="quote"> <h2>Building Big Relationships with Small Business.</h2> <p>&ldquo;This is quote Number three.<br /> They are there when I need them the most.&rdquo;</p> <p><span class="author">Jane Doe &ndash; Charlotte Flower Shop</span></p> <div class="help"><a href="cb_services.html">Let Us Help You</a></div> </div> </div> <div id="mainImg-4" class="slide"> <div class="quote"> <h2>Building Big Relationships with Small Business.</h2> <p>&ldquo;This is quote Number Fout.<br /> They are there when I need them the most.&rdquo;</p> <p><span class="author">Jane Doe &ndash; Charlotte Flower Shop</span></p> <div class="help"><a href="cb_services.html">Let Us Help You</a></div> </div> </div> Here is the CSS: .slideshow { width: 946px; height: 283px; border: 1px solid #c29c5d; margin: 8px; overflow: hidden; z-index: 1; } #mainImg-1 { width: 946px; height: 283px; background: url(../_images/main.jpg) no-repeat 9px 9px; } #mainImg-2 { width: 946px; height: 283px; background: url(../_images/main.jpg) no-repeat 9px 9px; } #mainImg-3 { width: 946px; height: 283px; background: url(../_images/main.jpg) no-repeat 9px 9px; } #mainImg-4 { width: 946px; height: 283px; background: url(../_images/main.jpg) no-repeat 9px 9px; } #mainImg-1 .quote, #mainImg-2 .quote, #mainImg-3 .quote, #mainImg-4 .quote { width: 608px; height: 168px; float: right; margin: 80px 11px 0 0; background: url(../_images/bg_quoteBox.png) repeat-x; } Before you go off and say, "hey, those images are all the same". You are right, the images are all the same right now, but the text should be rotating as well and there is a slight difference there. In addition, the fade should still show up. Anyway, you can see the dev page here: http://173.201.163.213/projectpath/first_trust/index.html I would appreciate some help to get this cycling through as it should. Thanks!

    Read the article

  • Load PHP function with jQuery Ajax

    - by brandon14_99
    I have a file which is loaded at the top of my document, which is called Videos.php. Inside that file are several functions, such as getYoutubeVideos. On some pages, I need to call upon that function several times (up to 50), and it of course creates major lag on load times. So I have been trying to figure out how to call that function in, only when it is need (when someone clicks the show videos button). I have very little experience with jQuery's ajax abilities. I would like the ajax call to be made inside of something like this: jQuery('a[rel=VideoPreview1).click(function(){ jQuery ("a[rel=VideoPreview1]").hide(); jQuery ("a[rel=HideVideoPreview1]").show(); jQuery ("#VideoPreview1").show(); //AJAX STUFF HERE preventDefault(); }); Ok I have created this based on the responses, but it is still not working: jQuery Code: jQuery(document).ready(function(){ jQuery("a[rel=VideoPreview5]").click(function(){ jQuery("a[rel=VideoPreview5]").hide(); jQuery("a[rel=HideVideoPreview5]").show(); jQuery.post("/Classes/Video.php", {action: "getYoutubeVideos", artist: "Train", track: "Hey, Soul Sister"}, function(data){ jQuery("#VideoPreview5").html(data); }, 'json'); jQuery("#VideoPreview5").show(); preventDefault(); }); jQuery("a[rel=HideVideoPreview5]").click(function(){ jQuery("a[rel=VideoPreview5]").show(); jQuery("a[rel=HideVideoPreview5]").hide(); jQuery("#VideoPreview5").hide(); preventDefault(); }); }); And the PHP code: $Action = isset($_POST['action']); $Artist = isset($_POST['artist']); $Track = isset($_POST['track']); if($Action == 'getYoutubeVideos') { echo 'where are the videos'; echo json_encode(getYoutubeVideos($Artist.' '.$Track, 1, 5, 'relevance')); }

    Read the article

  • Create nice animation on your ASP.NET Menu control using jQuery

    - by hajan
    In this blog post, I will show how you can apply some nice animation effects on your ASP.NET Menu control. ASP.NET Menu control offers many possibilities, but together with jQuery, you can make very rich, interactive menu accompanied with animations and effects. Lets start with an example: - Create new ASP.NET Web Application and give it a name - Open your Default.aspx page (or any other .aspx page where you will create the menu) - Our page ASPX code is: <form id="form1" runat="server"> <div id="menu">     <asp:Menu ID="Menu1" runat="server" Orientation="Horizontal" RenderingMode="List">                     <Items>             <asp:MenuItem NavigateUrl="~/Default.aspx" ImageUrl="~/Images/Home.png" Text="Home" Value="Home"  />             <asp:MenuItem NavigateUrl="~/About.aspx" ImageUrl="~/Images/Friends.png" Text="About Us" Value="AboutUs" />             <asp:MenuItem NavigateUrl="~/Products.aspx" ImageUrl="~/Images/Box.png" Text="Products" Value="Products" />             <asp:MenuItem NavigateUrl="~/Contact.aspx" ImageUrl="~/Images/Chat.png" Text="Contact Us" Value="ContactUs" />         </Items>     </asp:Menu> </div> </form> As you can see, we have ASP.NET Menu with Horizontal orientation and RenderMode=”List”. It has four Menu Items where for each I have specified NavigateUrl, ImageUrl, Text and Value properties. All images are in Images folder in the root directory of this web application. The images I’m using for this demo are from Free Web Icons. - Next, lets create CSS for the LI and A tags (place this code inside head tag) <style type="text/css">     li     {         border:1px solid black;         padding:20px 20px 20px 20px;         width:110px;         background-color:Gray;         color:White;         cursor:pointer;     }     a { color:White; font-family:Tahoma; } </style> This is nothing very important and you can change the style as you want. - Now, lets reference the jQuery core library directly from Microsoft CDN. <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.min.js"></script> - And we get to the most interesting part, applying the animations with jQuery Before we move on writing jQuery code, lets see what is the HTML code that our ASP.NET Menu control generates in the client browser.   <ul class="level1">     <li><a class="level1" href="Default.aspx"><img src="Images/Home.png" alt="" title="" class="icon" />Home</a></li>     <li><a class="level1" href="About.aspx"><img src="Images/Friends.png" alt="" title="" class="icon" />About Us</a></li>     <li><a class="level1" href="Products.aspx"><img src="Images/Box.png" alt="" title="" class="icon" />Products</a></li>     <li><a class="level1" href="Contact.aspx"><img src="Images/Chat.png" alt="" title="" class="icon" />Contact Us</a></li> </ul>   So, it generates unordered list which has class level1 and for each item creates li element with an anchor with image + menu text inside it. If we want to access the list element only from our menu (not other list element sin the page), we need to use the following jQuery selector: “ul.level1 li”, which will find all li elements which have parent element ul with class level1. Hence, the jQuery code is:   <script type="text/javascript">     $(function () {         $("ul.level1 li").hover(function () {             $(this).stop().animate({ opacity: 0.7, width: "170px" }, "slow");         }, function () {             $(this).stop().animate({ opacity: 1, width: "110px" }, "slow");         });     }); </script>   I’m using hover, so that the animation will occur once we go over the menu item. The two different functions are one for the over, the other for the out effect. The following line $(this).stop().animate({ opacity: 0.7, width: "170px" }, "slow");     does the real job. So, this will first stop any previous animations (if any) that are in progress and will animate the menu item by giving to it opacity of 0.7 and changing the width to 170px (the default width is 110px as in the defined CSS style for li tag). This happens on mouse over. The second function on mouse out reverts the opacity and width properties to the default ones. The last parameter “slow” is the speed of the animation. The end result is:   The complete ASPX code: <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server">     <title>ASP.NET Menu + jQuery</title>     <style type="text/css">         li         {             border:1px solid black;             padding:20px 20px 20px 20px;             width:110px;             background-color:Gray;             color:White;             cursor:pointer;         }         a { color:White; font-family:Tahoma; }     </style>     <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.min.js"></script>     <script type="text/javascript">         $(function () {             $("ul.level1 li").hover(function () {                 $(this).stop().animate({ opacity: 0.7, width: "170px" }, "slow");             }, function () {                 $(this).stop().animate({ opacity: 1, width: "110px" }, "slow");             });         });     </script> </head> <body>     <form id="form1" runat="server">     <div id="menu">         <asp:Menu ID="Menu1" runat="server" Orientation="Horizontal" RenderingMode="List">                         <Items>                 <asp:MenuItem NavigateUrl="~/Default.aspx" ImageUrl="~/Images/Home.png" Text="Home" Value="Home"  />                 <asp:MenuItem NavigateUrl="~/About.aspx" ImageUrl="~/Images/Friends.png" Text="About Us" Value="AboutUs" />                 <asp:MenuItem NavigateUrl="~/Products.aspx" ImageUrl="~/Images/Box.png" Text="Products" Value="Products" />                 <asp:MenuItem NavigateUrl="~/Contact.aspx" ImageUrl="~/Images/Chat.png" Text="Contact Us" Value="ContactUs" />             </Items>         </asp:Menu>     </div>     </form> </body> </html> Hope this was useful. Regards, Hajan

    Read the article

  • Is Form validation and Business validation too much?

    - by Robert Cabri
    I've got this question about form validation and business validation. I see a lot of frameworks that use some sort of form validation library. You submit some values and the library validates the values from the form. If not ok it will show some errors on you screen. If all goes to plan the values will be set into domain objects. Here the values will be or, better said, should validated (again). Most likely the same validation in the validation library. I know 2 PHP frameworks having this kind of construction Zend/Kohana. When I look at programming and some principles like Don't Repeat Yourself (DRY) and single responsibility principle (SRP) this isn't a good way. As you can see it validates twice. Why not create domain objects that do the actual validation. Example: Form with username and email form is submitted. Values of the username field and the email field will be populated in 2 different Domain objects: Username and Email class Username {} class Email {} These objects validate their data and if not valid throw an exception. Do you agree? What do you think about this aproach? Is there a better way to implement validations? I'm confused about a lot of frameworks/developers handling this stuff. Are they all wrong or am I missing a point? Edit: I know there should also be client side kind of validation. This is a different ballgame in my Opinion. If You have some comments on this and a way to deal with this kind of stuff, please provide.

    Read the article

  • Rsync plugin to many local wordpress installs via script or cli

    - by Nick Abbey
    I am maintaining a large number of wordpress installs on a production server, and we are looking to deploy InfiniteWP for managing these installs. I am looking for a way to script the distribution of the plugin folder to all of these installs. On server wp-prod, all sites are stored in /srv//site/ The plugin needs to be copied from ~/iws-plugin to /srv//site/wp-content/plugins/ Here's some pseudo code to explain what I need to do: array dirs = <all folders in /srv> for each d in dirs if exits "/srv/d/site/wp-content/plugins" rsync -avzh --log-file=~/d.log ~/plugin_base_folder /srv/d/site/wp-content/plugins/ else touch d.log echo 'plugin folder for "d" not found' >> ~/d.log end end I just don't know how to make it happen from the cli or via bash. I can (and will) tinker with a bash or ruby script on my test server, but I'm thinking the command-line-fu here on SF is strong enough to handle this issue much more quickly than I can hack together a solution. Thanks!

    Read the article

  • DRY Validation with MVC2

    - by Matthew
    Hi All, I'm trying to figure out how I can define validation rules for my domain objects in one single location within my application but have run in to a snag... Some background: My location has several parts: - Database - DAL - Business Logic Layer - SOAP API Layer - MVC website The MVC website accesses the database via the SOAP API, just as third parties would. We are using server and and client side validation on the MVC website as well as in the SOAP API Layer. To avoid having to manually write client side validation we are implementing strongly typed views in conjunction with the Html.TextBoxFor and Html.ValidationMessageFor HTML helpers, as shown in Step 3 here. We also create custom models for each form where one form takes input for multiple domain objects. This is where the problem begins, the HTML helpers read from the model for the data annotation validation attributes. In most cases our forms deal with multiple domain objects and you can't specify more than one type in the <%@Page ... Inherits="System.Web.Mvc.ViewPage" % page directive. So we are forced to create a custom model class, which would mean duplicating validation attributes from the domain objects on to the model class. I've spent quite some time looking for workarounds to this, such has referencing the same MetadataType from both the domain class and the custom MVC models, but that won't work for several reasons: You can only specify one MetadataType attribute per class, so its a problem if a model references multiple domain objects, each with their own metadata type. The data annotation validation code throws an exception if the model class doesn't contain a property that is specified in the referenced MetadataType which is a problem with the model only deals with a subset of the properties for a given domain object. I've looked at other solutions as well but to no avail. If anyone has any ideas on how to achieve a single source for validation logic that would work across MVC client and server side validation functionality and other locations (such as my SOAP API) I would love to hear it! Thanks in advance, Matthew

    Read the article

  • Create combined client side and server side validation in Symfony2

    - by ausi
    I think it would be very useful to create client side form validation up on the symfony2 Form and Validator components. The best way to do this would be to pass the validation constraints to the form view. With that information it would be possible to make a template that renders a form field to something like this: <div> <label for="form_email">E-Mail</label> <input id="form_email" type="text" name="form[email]" value="" data-validation-constraints='["NotBlank":{},"MinLength":{"limit":6}]' /> </div> The JavaScript part then would be to find all <input> elements that have the data-validation-constraints attribute and create the correct validation for them. To pass the validation constraints to the form view i thought the best way would be to create a form type extension. That's the point of my Question: Is this the correct way? And how is this possible? At the Moment my form type extension looks like this: use Symfony\Component\Form\FormInterface; use Symfony\Component\Form\FormView; use Symfony\Component\Form\FormBuilder; class FieldTypeExtension extends \Symfony\Component\Form\AbstractTypeExtension{ public function getExtendedType(){ return 'field'; } public function buildView(FormView $view, FormInterface $form) { // at this point i didn't find a way to get the // validation constraints out of the $form // the `getAllValidationConstraints` here is just an example $view->set('validation_constraints', $form->getAllValidationConstraints()); } } How can i get all validation constraints applied to one form field out of the FormInterface object?

    Read the article

  • In IE8, jquery-ui's dialog set the height of its contents to zero. How can I fix this?

    - by brahn
    I am using jquery UI's dialog widget to render a modal dialog in my web application. I do this by passing the ID of the desired DOM element into the following function: var setupDialog = function (eltId) { $("#" + eltId).dialog({ autoOpen: false, width: 610, minWidth: 610, height: 450, minHeight: 200, modal: true, resizable: false, draggable: false, }); }; Everything works just fine in Firefox, Safari, and Chrome. However, in IE 8 when the dialog is opened only the div.ui-dialog-titlebar is visible -- the div.ui-dialog-contents are not. The problem seems to be that while in the modern browsers, the div.ui-dialog-contents has a specific height set in its style, i.e. after opening the dialog, the resulting HTML is: <div class="ui-dialog-content ui-widget-content" id="invite-friends-dialog" style="width: auto; min-height: 198px; height: 448px">...</div> while in IE8 the height style attribute is set to zero, and the resulting HTML is: <div class="ui-dialog-content ui-widget-content" id="invite-friends-dialog" style="min-height: 0px; width: auto; height: 0px">...</div> What do I need to do to get the height (and min-height) style attributes set correctly?

    Read the article

  • Define "Validation in the Model"

    - by sunwukung
    There have been a couple of discussions regarding the location of user input validation: http://stackoverflow.com/questions/659950/should-validation-be-done-in-form-objects-or-the-model http://stackoverflow.com/questions/134388/where-do-you-do-your-validation-model-controller-or-view These discussions were quite old, so I wanted to ask the question again to see if anyone had any fresh input. If not, I apologise in advance. If you come from the Validation in the Model camp - does Model mean OOP representation of data (i.e. Active Record/Data Mapper) as "Entity" (to borrow the DDD terminology) - in which case you would, I assume, want all Model classes to inherit common validation constraints. Or can these rules simply be part of a Service in the Model - i.e. a Validation service? For example, could you consider Zend_Form and it's validation classes part of the Model? The concept of a Domain Model does not appear to be limited to Entities, and so validation may not necessarily need to be confined to this Entities. It seems that you would require a lot of potentially superfluous handing of values and responses back and forth between forms and "Entities" - and in some instances you may not persist the data recieved from user input, or recieve it from user input at all.

    Read the article

  • properties-maven-plugin: Error loading properties-file

    - by yournamehere
    I want to extract all the properties from my pom.xml into a properties-file. These are the common properties like dependency-versions, plugin-versions and directories. I'm using the properties-maven-plugin, but its not working as i want it to. The essential part of my pom.xml: <plugin> <groupId>org.codehaus.mojo</groupId> <artifactId>properties-maven-plugin</artifactId> <version>1.0-alpha-1</version> <executions> <execution> <phase>initialize</phase> <goals> <goal>read-project-properties</goal> </goals> <configuration> <files> <file>${basedir}/pom.properties</file> </files> </configuration> </execution> </executions> </plugin> Now when i run "mvn properties:read-project-properties" i get the following error: [INFO] One or more required plugin parameters are invalid/missing for 'properties:read-project-properties' [0] Inside the definition for plugin 'properties-maven-plugin' specify the following: <configuration> ... <files>VALUE</files> </configuration>. The pom.properties-file is located in the same dir as the pom.xml. What can i do to let the properties-maven-plugin read my properties-file?

    Read the article

  • jQuery validator not working in unit testing

    - by Dbugger
    I have this small HTML file: <html> <head></head> <body> <form id='MyForm'> <input type='text' required /> <input type='submit' /> </form> <script src="/js/jquery-1.9.0.js"></script> <script src="/js/jquery.validate.js"></script> <script> var validator = $("#MyForm").validate(); alert(validator.form()); </script> </body> </html> This alerts me with "false", which is the expected behaviour. The problem comes when I go to unit testing, with js-test-driver: TestCase("MyTests", { setUp: function() { this.myform = "<form id='MyForm'><input type='text' required /><input type='submit' /></form>"; this.validator = $(this.myform).validate(); jstestdriver.console.log("Does the form validate? " + this.validator.form()); }, test_empty: function() { }, }); This code returns me the string Does the form validate? true This is a simplified version of my project of course, but the point is that I dont seem to be able to unit test the validation module im developing, since the jQuery validate plugin doesnt seem to work. What am I missing?

    Read the article

< Previous Page | 29 30 31 32 33 34 35 36 37 38 39 40  | Next Page >