selecting the right element using jquery - jquery-selectors

Starting from the solution provided by the Nick Caver I wish to save some inputs provided by the users into a db. The problem is that I don't know how to select the right input from the current dialog box, using jQuery.
Here is my working code.

I've solve it. I had to use :last selector. I think is a good solution.
What do you think? I'm new in jQuery

Related

Chrome: Fill out same form many times for testing

Is there some kind of tool (ideally for Chrome) in which I can fill out a long form that I am designing/testing many times?
I should be able to:
Fill out everything once and save it
Fill in the saved form with one button click
Fill out the form differently and save it as a different "profile"
I'm testing some things manually during development so I don't want a fully automated solution for this (I am using Symfony2.1 so I can write functional tests also). I just need a way to quickly fill out the form so I can save myself some time but I haven't been able to find a good Chrome extension or anything to do it. I remember Firebug in Firefox having something like this I think (I never used it though) so I imagine something exists.
The built in saved forms don't seem to be as useful for this task but maybe I'm missing something.
You can check out iMacros for Chrome:
https://chrome.google.com/webstore/detail/imacros-for-chrome/cplklnmnlbnpmjogncfgfijoopmnlemp
Call it a rudimentary answer, but I believe the button shortcuts in Chrome accept Javascript. I've done this with FireFox by doing something like:
javascript:document.formname.fieldname.value='value';document.formname.fieldname2.value='value';document.formname.fieldname3.value='value';return false;
There are some plugins. I used the below one, and it can satisfy your requirement.
This extension allows you to fill all form inputs with dummy data.
https://chrome.google.com/webstore/detail/form-filler/bnjjngeaknajbdcgpfkgnonkmififhfo
Here this one is for storing the form data and reusing it later. plugin populates with the data saved later when you want to fill it again.
https://chrome.google.com/webstore/detail/simple-form-filler/hbgbedpagfcecmjmlfpndghfclhnmmll/details
Hope this helps
This isn't an extension, but I've always found the easiest way to test a form is with a little jQuery.
I put a link under the submit button:
fillform
Then I fill the form with jQuery.
$('#fill_form').click(function(event) {
$("#name").val("Phoney Phoneyman");
$("#phone").val("555 867-5309");
$("#email").val("phoney#baloney.com");
$("#password").val("123456");
$("#password_conf").val("123456");
});
It takes about as long to do this as it does filling out the form initially and saves a ton of time. A tiny bit more work and you could generate random values - or values from a list.
Just remember to delete it all when you're done.
Google's form filler is just always incorrect enough to create work rather than save time.
Best form fill up extension ever is JunkFill.
I love it.
There is now a Selenium extension for Chrome. Selenium is one of the most popular webdrivers, I've used this as well, and even though there are a few oddballs in there, it works well generally:
https://chrome.google.com/webstore/detail/selenium-ide/mooikfkahbdckldjjndioackbalphokd?hl=en
I have made a chrome extension which exactly matches your needs, it may be worth a try - SimpleFill.
It's really simple and is available for Chrome, Opera, and Firefox.
Another useful chrome extension Formbot. When set to randomly fill the inputs, it will fill them with valid data.
You can check the Bug Magnet Chrome extension.

twitter bootstrap autocomplete dropdown / combobox with Knockoutjs

I have a requirement where I HAVE TO use bootstrap autocomplete dropdown, BUT user can have free form text in that dropdown if they wish. Before you think about TypeAhead, I could use Bootstrap TypeAhead textbox, but I need to have the dropdown becasue we want to give some default values as headstart options in case users dont know what to search for.
I am using this with MVC DropDownListFor as that creates a select control for us.
I found this article which does that for me.
https://github.com/danielfarrell/bootstrap-combobox/pull/20
All I had to do was take off the name from the select control and the control was letting me enter free form text. All good so far.
Now, I am using this in conjunction with Knockoutjs. I bind my options and selected value to the select control and then on row rendered of my template, I called (selector).combobox() which makes the select control a bootstrap comobobox and adds an input control and hides the select control in the scenes behind.
The problem now is when I try to get he values to post to server, since the value I put in input box is not a valid options from the options I gave to select control, it is always setting it to the first option by default. This is becasue, I set the binding of the selected value on select control and not on the input box which was created by bootstrap-combobox.js.
My question is how do I get the input box to data-bind to the same porperty as the the select control was bound to.
Any other options??
Let me know if you need more clarification or have questions.
Please suggest.
Thanks.
Have a look at Select2 for Bootstrap. It should be able to do everything you need.
Another good option is Selectize.js. It feels a bit more native to Bootstrap.
Does the basic HTML5 datalist work? It's clean and you don't have to play around with the messy third party code. W3SCHOOL tutorial
The MDN Documentation is very eloquent and features examples.
Select2 for Bootstrap 3 native plugin
https://fk.github.io/select2-bootstrap-css/index.html
this plugin uses select2 jquery plugin
nuget
PM> Install-Package Select2-Bootstrap
Fuel UX combobox has all the features you would expect.
Can i suggest http://www.jqueryscript.net/form/Twitter-Like-Mentions-Auto-Suggesting-Plugin-with-jQuery-Bootstrap-Suggest.html, works more like the twitter post suggestion where it gives you a list of users or topics based on # or # tags,
view demo here: http://www.jqueryscript.net/demo/Twitter-Like-Mentions-Auto-Suggesting-Plugin-with-jQuery-Bootstrap-Suggest/
in this one you can easily change the # and # to anything you want
Bootstrap Tokenfield seems good too: http://sliptree.github.io/bootstrap-tokenfield/

Symfony sfFormFilters - when would you use it?

So I'm somewhat aware of what sfFormFilter can do, but I'm more interested in when you would use it, or why. For the most part I don't understand why I'd use form filters when I can just use the forms.
Is there a conceptual difference? Or is there a feature/functional difference in the two?
If this is mentioned in the jobeet tutorial then I've definitely missed it and someone just pointing me in that direction would be cool
sfFormFilter is the form that you see when you do php symfony doctrine:generate-admin ... and go to the list action of your new module, on the right side (depending on your admin theme).
This is the form used to filter your list. So you can edit this class if you're not happy with the generated form fields, need different widgets or change other configurations.
The example below is the form filter taken from sf_guard_permission/list:

is it possible to interact with hidden elements in selenium2?

I need set value in Hidden inputfield of my webpage, I am using Selenium 2.
I tried with webelement.sendKeys(value), but its not working.
Can anybody tell me how to do this ?
Thanks.
That question seems a little bit out of the box. Selenium is simulating user-based interactions. So, that's pointless to expecting from a user editing hidden elements on the page. But may be you should say why do you need this and what are you trying to do with this function, it can be more easy to finding some workarounds for it.
You can't modify the hidden object using element methods. Instead, send script to the driver:
#driver.execute_script("document.getElementById('context-menu-upload').value=#{value}")
Here is the documentation: execute_script(script, *args)
To use xpath instead, try this:
Is there a way to get element by XPath using JavaScript in Selenium WebDriver?

MVC2 Multi Select drop down list

I have 2 multi-select Html.DropDownList controls with a button between them. When the user selects items from the first and presses the button they are copied to the second Html.DropDownList control via JQuery.
My problem is when the form is posted back I do not know how to obtain all the values in the second Html.DropDownList control.
This would be really easy with web forms but I have no idea how to do it with MVC2
thanks
--- Also I will need to validate the second Html.DropDownList to ensure it contains at least one item.
Okay, I can get it to work by selecting all the items in the list with JavaScript right before the post back. This feels like such a hack to me though. Surely there is a better way to do it then this. Does anyone know of a way that does not rely on JavaScript?
If relying on JavaScript is the standard way to do this sort of thing then can someone explain why this is okay... Or is this an example of the immaturity of the MVC model?
Thanks.