goodacre.liam

You probably want something like: // Renders a single item as html var renderItem = function (item) { return '<img src="' + encodeURI(item) + '">' } // Render and display all the photo file items $('#photosTab').html($.map(json.photoFiles, renderItem)) Before you get unnecessarily far down the rabbit hole with manual dom interaction, take a look into Facebook's React library. It allows you to program much more intuitively, and simply by saying that your 'view' is a function of the state of your application at any point in time. Hope this helps.

I'm not experienced with it (in fact I had never heard of either of the two). You'll either have to write a plugin for it (if that functionality can be added by plugin), or modify the bsmSelect source for your needs. Might be worth a Google for plugins that other people have written for it, to get a picture of what can be accomplished.

Awesome! I'm glad to have helped.

It is definitely possible: There is a fork of asmSelect called bsmSelect https://github.com/vicb/bsmSelect Check out the bottom example on this page: http://www.suumit.com/projects/bsmSelect/examples/index.html Is this similar to what you wanted? As bsmSelect also allows plugins: so you should be able to add in functionality that allows two drop-down selection boxes with a parent-child relationship. Hope this helps.

Unless you have further issues to discuss, please mark this problem as 'Solved'.

I was referring to this part of the code you posted: if( (p1cards.length = 0)||(p2cards.length = 0) ){

To set the id of an element, you can use the 'attr' method: // setter $('...selector...').attr('id', 'thenewid'); // getter var id = $('...selector...').attr('id'); I would say that it would be better to use add/remove class as smoseley suggested. Although I don't fully know your situation, ids may be applicable. @smoseley: You missed out the function keyword from the second procedure. $(".featured").hover(function () { $(this).addClass('hover'); }, function () { $(this).removeClass('hover'); });

Also, in your first if statement you are using '=' which is the assignment operator. You should be using '===' for the equality comparison operator. To extend on what 'requinix' said: the 'click' method on a jQuery object attaches an event handler to when the related dom elements are clicked. It doesn't invoke a click. To invoke, I believe there is a method called 'trigger': $('...').trigger('click'). I think you need to rethink your program design - does this really require any recursion? Regards, Liam Goodacre

My interpretations: A. You are wanting to use an html file as a template for inserting data into and then attaching into your current web page. B. You are wanting to read an html file and extract data from it. For A, have a look at JavaScript templating libraries such as Handlebars.js {http://handlebarsjs.com/} or Moustache.js {https://github.com/janl/mustache.js}. For B, you could create an html entity that isn't attached to the dom. Load the html file via ajax, and use the file contents as the entity's inner-html. Then traverse the entity's children to extract the data required. Regards, Liam Goodacre

This thread is brilliant. Also, I'm sorry mate, I've tried going through your code but it is pretty unfathomable. Although I think you may be wanting to use an object instead of an array: var country = { 'Pakistan' : { 'Punjab' : ['Faisalabad','Lahore','Multan'], 'Sindh' : ['Karachi'] }, 'USA' : { 'New York': ['New York','New York2'] } };

Is it because the majority of your code is actually commented out from the beginning of this line: /*for (x=0;x<8;x++){

Hey, here are a few pointers: The reason your JavaScript doesn't seem to be executing properly is because it is assigning the click handler before the element exists! One way to defer your code from executing until the DOM is ready (meaning that your element will have been loaded), is to use the following code: // Once the DOM is ready jQuery(function ($) { // Add a #button click event callback $('#button').click(function(){ alert('Hello'); }); }); The jQuery function accepts function expressions which it will execute when it detects the DOM has loaded. An alternate way is to shift all your 'script' tags to the bottom of the body, so that the script will always execute after the element is loaded. This would be my preferred method. Another point is that you might want to start using html5 now. This means we can get rid of the nasty doctype and replace it with: <!doctype html> Under this doctype, script tags no-longer need an explicit 'type' if they are JavaScript. The convention is also to never attach JavaScript to elements as inline attributes: <input onfocus="outline();" /> The outline function should be attached using JavaScript, similar to the way you wish to attach a click handler: $('#form1 input:not([type=submit])').focus(outline); One last point is that I think you have your form tag under an illegal parent (I could be wrong). In your case, the form should wrap around the whole table. Hope this helps. Liam Goodacre

From what I understand from your post, you should just need to change: if (error == -1) To the following: if (error !== -1) Hope this helps.

So do you just mean the following? // when clicking on the document $(document).click(function () { // hide element '#div2' $('#div2').hide(); }); Hope this helps.

Instead of onclick on the submit button, attach to the onsubmit event of the form. Also on your buttons, their 'type' should be set to 'submit' not 'button'. If you wish to use jQuery to attach your events, you could do something along the lines of: jQuery(function ($) { $('#validate').submit(function (e) { // validation code... // use 'e.preventDefault()' to stop form submission }); }); Also in your JavaScript you have the following line: if(data = "yes") Shouldn't this be: if (data === "yes") Hope this helps.

Do you mean something like this? jQuery(function ($) { // when clicking on the document $(document).click(function () { // hide/show element '#div2' $('#div2').toggle(); }); }); Hope this helps.

How about this? jQuery(function($) { $('[id^="time"]').timePicker(); }); This selects all those which have an id starting with "time". Alternatively just give them all the same class: jQuery(function($) { $('.time').timePicker(); }); Hope this helps.

How about something like this? (I've tested this one and it works for me!) $(function() { // constant data var CONFIRM_MESSAGE = "Are you sure you want to submit?", FORM_ID = "#v21frm"; // on submission $(FORM_ID).submit(function (e) { var answer; // confirm the form submission answer = confirm(CONFIRM_MESSAGE); // cancel submission? if (!answer) { e.preventDefault(); return false; } }); }); Ignore the enter press and just run the code on form submission. If the confirmation returns false, then the submission is aborted! I hope this helps, Liam Goodacre

I find your code to be a little strange; so here are a few pointers! Always declare your variables in the scope they are needed. In your code 'answer' was used without declaration – this means it would be a property of the global object and accessible anywhere (i.e. a global variable). This means it could possibly interfere with other code and cause other problems. 'submitHandler' is used as a label, I'm unsure if that is what you meant or if it was supposed to be a variable. You are declaring an anonymous function after the 'submitHandler' label, which isn't being called (therefore the confirmation and submit code isn't being executed). Here is my rewrite of your code (btw, I haven't tested it): $(function() { // constant data var CONFIRM_MESSAGE = "Are you sure you want to submit?", FORM_ID = "#v21frm", ENTER_KEY = 13; // on keyup $(document).keyup(function (event) { var answer; // if enter key released if (event.keyCode === ENTER_KEY) { // confirm the form submission answer = confirm(CONFIRM_MESSAGE); // on confirmation if (answer) { // submit the form $(FORM_ID).submit(); } return false; } }); }); I hope this helps, Liam Goodacre

Do you mean something like this? (function(){ var actionMap = { 'F' : 'flug.php', 'FH' : 'flugandh.php' }; $("#bookingType").change(function() { var action = $(this).val(); if (action in actionMap) { $("#book-travel-form").attr("action", actionMap[action]); } }); }()); The 'actionMap' object defines which action values map to which file. If the action exists in the mapping, then set the action attribute to the corresponding file. Hope this helps, Liam Goodacre

If you want to create new instances of functions which extend another, the following could help: //@Using Function prototype Function.prototype.extend = function (_callback) { var self = this; return function () { self(); _callback(); }; } //@Using Function - Preferred Method Function.extend = function (_base, _callback) { return function () { _base(); _callback(); }; } //@Example var func1, func2, func3; // Base function func1 = function () { console.log('FUNC1'); }; // Using prototype extend func2 = func1.extend(function () { console.log('FUNC2'); }); // Using Function extend - Preferred Method func3 = Function.extend(func2, function () { console.log('FUNC3'); }); I wouldn't use the Function.prototype method, as modifying core object prototypes is usually a bad idea. But extending Function is perfectly fine. In the examples above, func1 would log FUNC1, func2 would log FUNC1, FUNC2, and func3 would log FUNC1, FUNC2, and FUNC3. If you want to attach methods automatically, for example: func1.extend(function () { // extension code }) And you want func1 to be modified, you could write a new function builder, which stores a chain of methods. As such: //@Method builder var Method = function (_func) { var chain = [_func]; var core = function () { for (var index = 0, max = chain.length; index < max; ++index) { chain[index](); } }; core.extend = function (_func) { chain.push(_func); }; return core; }; //@Demo usage var func1; func1 = new Method(function () { console.log('Running func1'); }); func1.extend(function () { console.log('Extended'); }); func1.extend(function () { console.log('And Again!'); }); func1(); // logs 'Running func1', 'Extended', and 'And Again!' Hope this helps!