Twitter bootstrap typeahead works only for the first element on the page - bootstrap-typeahead

I'm using typeahead for several elements on my page, but it only works for the 1st one and doesn't for the rest of them, although their data source is generated in absolutely same manner and has all the right values (data-source="["abc","cbd"]").
Does anybody know why it happens?
Thank you

Related

web submission automation: simulate onclick event on a title element to load form

A resume-service I use requires that for each listed activity on the resume, there is an hours-per-week field and total hours field. However, the total hours field does not update itself automatically no matter how many weeks pass. My goal is to write a script that does this.
The idea behind the script is:
Log in to website -> go to a certain page -> submit a form** on that page updating the total hours
**unfortunately, for the form to open, you need to click an "edit" title element first which causes it to show up. I've taken a look at the html of the webpage but cannot find the form or input tags corresponding to the form I wish to submit, only that the form is generated with what I think is a javascript function call from the element's onclick field.
I believe the relevant html snippet is:
<a title="edit" class="edit" href="#entry-type" onclick="editComponent('10227041','education');">Edit</a>
but just in case there is a much larger code snippet later in this post (check the 2nd pastebin link at the bottom)
THE QUESTION: Is there a specific language/library/way (preferably in python, although I can work with Java) to simulate an onclick event and that would result in a form loading?
I've worked on this problem a bit, starting with python's mechanize library. I wrote two functions,
def login(br,url):...
def navigate(br,baseurl,url):...
which would satisfy the first two parts of my script's plan, but the third is where the trouble starts. When I print all the forms on the page using
for form in br.forms():
print form
I get http://pastebin.com/Gxy2tc1A
The website's html can be found on http://pastebin.com/PySri5cb
Later I tried to work with Selenium (the firefox IDE plugin) and then exporting code into python, where I would edit it to satisfy my specific needs, but that was a no-go either due to some awkward errors.
Have you looked into GreaseMonkey? You should be able to use that to extract the hours per week, do the math and populate the total hours field. You could probably do the entire thing. Anything that can be done on the page in JavaScript could be done within GreaseMonkey.
EDIT: The code for that site is awful. I especially like the inline call to loadResume() that is made BEFORE the element it writes to (#build-wrap).

How to track checkboxes with Django and endless pagination?

I am a Django noob and have a situation that goes beyond the basic documentation, etc.
I am updating an ordering webpage that has a form structured as follows:
several text boxes, etc to gather general info (name, date, etc)
two separate tables for selecting (via checkbox) catalogs that are generated/managed using endless_pagination. Each table can have thousands of records, hence the endless_pagination. The first column in each table is a checkbox with value = catalog.id.
a textbox where the user can manually enter catalog IDs
a submit button
I am not sure how to keep track of what a user has selected in the two paginated tables since the checked boxes are lost when choosing a different page. Also, when the user flips back and forth between the pages, the previoulsy checked catalogs will need to be re-checked(since the checked state is not maintained). I am also not sure which tool(s) to use to deal with this.
My thought is to use JavaScript (with which I have minimal experience) to update a list of catalog IDs whenever a checkbox is checked/unchecked and:
- and attach that list to the form or
- update a variable in the form or
- send as a variable separate from the form, whichever is possible/makes more sense.
I'm hoping that maintaining a list of catalog IDs is possible because the next iteration of this form will likely include some sort of filtering so I'm trying to devise a solution that will not have to be reworked later.
I have reviewed a lot of posts but I believe the closest solutions are rendered useless because of the endless_pagination.
Let me know if further clarification is required. Thanks in advance for any suggestions.
UPDATE
I tried using JavaScript to store the catalog IDs in an array when a checkbox is checked. This does not work when a user selects another page in the pagination. The array of checked catalog IDs is lost when the page 'reloads'.
I'm running into this problem right now as well. I'm handling this by writing the checked items to localStorage so they carry across to page 2, 3, etc.. as well as show up as already checked when you go back to page 1. Then every time the page loads, either find and check the existing checkbox, or create a hidden input with the appropriate name and value and append it to the main form.
var selected_items = []
function add_item_to_checkbox(item) {
localStorage.setItem('selected_items', JSON.stringify(selected_items));
checkbox.on("click", add_item_to_checkbox);
bahh... Just look at my jsfiddle it's easier to read and yeah. I don't have to type JS into a textarea on stackoverflow.
Here is my javascript minus a few things that are specific to my code. I'm sure it could be improved upon but it works really well for my application.

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.

tiny mce not working properly in google chrome

I have four textareas in my form. TinyMce editor applies to only first row of the textarea, remaining rows for textareas dont get editor in google chrome. It works fine in firefox instead.
It's hard to know without seeing the code, but I'm going to go ahead guess that you are referencing your multiple textareas using the same ID. IDs must be unique - so give them each their own individual ID and then attach the editor with four separate calls, or reference them by class instead.
Or attach some code for us to take a look at.

Go to a new page, but still have GWT variables?

In GWT, I would like to do something like a form submission that takes me to a new page, with new style sheet and new static elements, and when I get there, be able to extract the values of GWT variables still in GWT. In other words, I want to do most of the form processing on the client side instead of sending it to a servlet to be processed and sent back. Is that possible? Would FormPanel allow me to do that? How do I access the contents of the form fields in GWT on the new page?
I'm not sure I'm getting the right picture here, but I see several possibilities:
Pass the variables in the url like example.com/myform#create/param1/param2 or any other format you want, then read it using the History class
Use something like this - create an iframe from GWT (maybe put it in Lightbox or something similar), populate it the way you want using the current state of the app, and when the user is finished, he'll just close the (Lightbox) frame and get back to the main application
You could also pass around data in a "hidden" way (no visible data in the url or even through POST) using the window.name hack - there's even a sample implementation for GWT to get you started
ATM, I prefer the second option, since it goes best with the whole no refresh, same page, one app, GWT thing :) That is, unless I'm getting the wrong picture and you want to do something else.
GWT is really meant to be used for the whole application, where "pages" are replaced by application state and URL fragments, and "form submission" is replaced by AJAX calls.
If you want to validate form fields, this can easily be done with regular JS or a library like jQuery.
I'm not sure it I get you right either, but for what I'm receiving, having a new page to process the form is not the optimal design. The reason been that you might have to write different GWT app for that which mean overheads, and creating new window (or tab) will move the user's attention away from where they are. Why not using another page WITHIN gwt to process the form with tab panel or hidden panel?