I was trying to generate a new form group by clicking the button. But after that all I can't remove selected group, because click event doesn't work. here is fiddle example:       (function($) {     'use strict';     $(document).ready(function() {      $('.add').on('click', function(e) {       e.preventDefault();       $('.groups').append('\         &lt;div class="form-group"&gt;\           &lt;input type="text"&gt;\           &lt;a href="#" id="remove-input"&gt;Remove&lt;/a&gt;\         &lt;/div&gt;\       ');     });      $('#remove-input').on('click', '.form-group', function(e) {         e.preventDefault();       $(this).parent('.form-group').remove();     });    });     }(jQuery));
112
I have a bit of code where I am looping through all the select boxes on a page and binding a .hover event to them to do a bit of twiddling with their width on mouse on/off.  This happens on page ready and works just fine.  The problem I have is that any select boxes I add via Ajax or DOM after the initial loop won't have the event bound.  I have found this plugin (), but before I add another 5k to my pages with a plugin, I want to see if anyone knows a way to do this, either with jQuery directly or by another option.
98687
If the user selects an option in a dropdown box, there must be added a label and a textbox. Using appendChild, these elements get added to the end of the container.  var newFreeformLabel = document.createElement('label'); newFreeformLabel.innerHTML = 'Omschrijving:';  var newFreeformField = document.createElement('input'); newFreeformField.className = 'textfield'; newFreeformField.name = 'factuur_orderregel[]';  var newFreeformSpacer = document.createElement('div'); newFreeformSpacer.className = 'spacer';  container.appendChild(newFreeformLabel); container.appendChild(newFreeformField); container.appendChild(newFreeformSpacer);   The issue is that these elements should be inserted at the beginning of container, not at the end.  Is there a solution to this in PrototypeJS?
80656
I want do something like this:  Button btn1 = new Button(); btn1.Click += new EventHandler(btn1_Click); Button btn2 = new Button(); // Take whatever event got assigned to btn1 and assign it to btn2. btn2.Click += btn1.Click; // The compiler says no...   Where btn1_Click is already defined in the class:  void btn1_Click(object sender, EventArgs e) {     // }   This won't compile, of course ("The event 'System.Windows.Forms.Control.Click' can only appear on the left hand side of += or -="). Is there a way to take the event handler from one control and assign it to another at runtime? If that's not possible, is duplicating the event handler and assigning it to another control at runtime doable?  A couple of points: I have googled the heck out of this one for awhile and found no way of doing it yet. Most of the attempted approaches involve reflection, so if you read my question and think the answer is incredibly obvious, please try to compile the code in Visual Studio first. Or if the answer really is incredibly obvious, please feel free to slap me with it. Thanks, I'm really looking forward to seeing if this is possible.  I know I could just do this:  btn2.Click += new EventHandler(btn1_Click);   That's not what I'm looking for here.  This is also not what I'm looking for:  EventHandler handy = new EventHandler(btn1_Click); Button btn1 = new Button(); btn1.Click += handy; Button btn2 = new Button(); btn2.Click += handy;
71962
I have an element with an onclick method.  I would like to activate that method (or: fake a click on this element) within another function.  Is this possible?
100723
I am building an application where I want to be able to click a rectangle represented by a DIV, and then use the keyboard to move that DIV by listing for keyboard events.  Rather than using an event listener for those keyboard events at the document level, can I listen for keyboard events at the DIV level, perhaps by giving it keyboard focus?  Here's a simplified sample to illustrate the problem:  &lt;html&gt; &lt;head&gt; &lt;/head&gt; &lt;body&gt;  &lt;div id="outer" style="background-color:#eeeeee;padding:10px"&gt; outer     &lt;div id="inner" style="background-color:#bbbbbb;width:50%;margin:10px;padding:10px;"&gt;    want to be able to focus this element and pick up keypresses    &lt;/div&gt; &lt;/div&gt;  &lt;script language="Javascript"&gt;  function onClick() {     document.getElementById('inner').innerHTML="clicked";     document.getElementById('inner').focus();  }  //this handler is never called function onKeypressDiv() {     document.getElementById('inner').innerHTML="keypress on div"; }  function onKeypressDoc() {     document.getElementById('inner').innerHTML="keypress on doc"; }  //install event handlers document.getElementById('inner').addEventListener("click", onClick, false); document.getElementById('inner').addEventListener("keypress", onKeypressDiv, false); document.addEventListener("keypress", onKeypressDoc, false);  &lt;/script&gt;  &lt;/body&gt; &lt;/html&gt;   On clicking the inner DIV I try to give it focus, but subsequent keyboard events are always picked up at the document level, not my DIV level event listener.  Do I simply need to implement an application-specific notion of keyboard focus?  I should add I only need this to work in Firefox.
43168
Let's say you create a wizard in an HTML form. One button goes back, and one goes forward. Since the back button appears first in the markup when you press Enter, it will use that button to submit the form.  Example:    &lt;form&gt;   &lt;!-- Put your cursor in this field and press Enter --&gt;   &lt;input type="text" name="field1" /&gt;    &lt;!-- This is the button that will submit --&gt;   &lt;input type="submit" name="prev" value="Previous Page" /&gt;    &lt;!-- But this is the button that I WANT to submit --&gt;   &lt;input type="submit" name="next" value="Next Page" /&gt; &lt;/form&gt;     I would like to get to decide which button is used to submit the form when a user presses Enter. That way, when you press Enter the wizard will move to the next page, not the previous. Do you have to use tabindex to do this?
95782
So I did some reading of the related questions and had some interesting stuff but did not find my answer, at least did not understand the answer.  I am very new to AJAX, javascript and sclient side scripting in general.  I have been using C# asp.net for a bit and recently added some updatepanels to my side to smooth so of the user controls and bits being updated so that the page was not reloaded each time.  All works brilliantly and I was very happy with it till I decided to try and use some JQuery.  I have picked up the datepicker from ui.jquery.js which is cool and works great on a normal page.  My problem arrives when I do a postback from within an updatepanel.  The datepicker just stops working.  from what I have read I need to manually wire this back up after the post back.  1)  I don't really understand why.  on my master page I have:  &lt;script type="text/javascript"&gt;     $(function() {         $(".mydatepickerclass").datepicker({dateFormat: 'dd-mm-yy'});     }); &lt;/script&gt;   which picks up my input boxes with the mydatepickerclass assigned. and all works.  Why would this stop working on the postback.  2)  How do I fix this.... how do I wire it up so that after a postback in an updatepanel it still works.  I understand that the ID might change on a postback, I think but as I am using classes I don't know what is going wrong.  edit  I have the following code in my usercontrol where the update is happening:  &lt;asp:UpdatePanel ID="HistoryUpdatePanel" runat="server"&gt; &lt;ContentTemplate&gt;     &lt;%-- Start of Company History section --%&gt;     &lt;fieldset&gt;         &lt;legend&gt;Activity History&lt;/legend&gt;             &lt;script type="text/javascript"&gt;               $(function() {               $(".mydatepickerclass").datepicker({dateFormat: 'dd-mm-yy'});               });            &lt;/script&gt;                      &lt;div&gt;             &lt;asp:ListBox ID="listBoxHistoryTypes" runat="server" SelectionMode="Multiple" AutoPostBack="true" OnSelectedIndexChanged="listBoxHistoryTypes_IndexChanged" /&gt;             &lt;label&gt;Date From:&lt;/label&gt;&lt;asp:TextBox class="mydatepickerclass" ID="txtdatefrom" runat="server" /&gt;             &lt;label&gt;Date To:&lt;/label&gt;&lt;input class="mydatepickerclass" type="text" /&gt;             &lt;asp:TextBox class="mydatepickerclass" ID="txtdateto" runat="server" /&gt;             &lt;asp:Button ID="btnFilterSearch" runat="server" Text="Filter Results" OnClick="btnFilterSearch_Click" /&gt;         &lt;/div&gt;       &lt;/fieldset&gt; &lt;/ContentTemplate&gt;     Does the script inside the updatepanel not rewire it?  Thanks  Jon Hawkins
70777
I have an afterInsert trigger on Events. When the Script is finished, I would like to delete the event. I keep getting this error message.     DML statement cannot operate on Trigger.new or Trigger.old   If I cannot do this within Trigger.new, what is the best way to do this? If SOQL is involved, what field am I looking for? event.ID?
67914
I am creating an element with document.createElement(). Now how can I pass it to a function that only takes a Jquery object?  $("#id")    I can not use it, as the element has not been rendered in the page yet.
15800
Well I am trying to submit a form by pressing enter but not displaying a submit button. I don't want to get into JavaScript if possible since I want everything to work on all browsers (the only JS way I know is with events).  Right now the form looks like this:  &lt;form name="loginBox" target="#here" method="post"&gt;     &lt;input name="username" type="text" /&gt;&lt;br /&gt;     &lt;input name="password" type="password" /&gt;     &lt;input type="submit" style="height: 0px; width: 0px; border: none; padding: 0px;" hidefocus="true" /&gt; &lt;/form&gt;   Which works pretty well. The submit button works when the user presses enter, and the button doesn't show in Firefox, IE, Safari, Opera and Chrome. However, I still don't like the solution since it is hard to know whether it will work on all platforms with all browsers.  Can anyone suggest a better method? Or is this about as good as it gets?
60693
I'm using stackoverflow.com with JavaScript off. I accept this comes with somewhat less functionality, however for the most part SO works fine.  If I look at the home page (), every single button on there except for two types works with JS off.  The first second is that the "x Votes; y answers;z views" mouse-over indicates they're links but clicking them does nothing. This one is less of an issue because the user can still click the question title, and they're only implied buttons anyway.  The second (and bigger) issue is the "Add" buttons next to "Favorite Tags" and "Ignored Tags". These are explicit buttons that don't do anything with JS off. There is no working JS substitute for them (the "tag subscriptions" link itself works, but the page it goes to doesn't work with JS off, but that's another bug report).
23400
How do I remove items from, or add items to, a select box? I'm running jQuery, should that make the task easier. Below is an example select box.  &lt;select name="selectBox" id="selectBox"&gt;     &lt;option value="option1"&gt;option1&lt;/option&gt;     &lt;option value="option2"&gt;option2&lt;/option&gt;     &lt;option value="option3"&gt;option3&lt;/option&gt;     &lt;option value="option4"&gt;option4&lt;/option&gt;     &lt;/select&gt;
98151
I was astonished when I heard the announcement of left Click by Default. Anyway  I gave it a try and it felt familiar. but I got stuck when it came to adding objects to the current selection. Ok now I know shift+CTRl left Clicking ads new objects to my selection (why not shift or CTRL). But I have no idea how to deselect one object from the selection.  Can you help me?
17965
I need to prevent accidental clicks in the Save button when a node is being saved.  I found this   which does exactly this. But the problem is that it uses javascript (jquery). Then if the user disable javascript this module is useless.  My problem is that in my website the user get points when creating nodes, so I have to prevent this in a more secure way.  How can I do this?   What do you think of these ideas?:  1) Maybe I would forbid the node being saved more than one time    programmatically instead of disabling the Save button.   2) Or better: I would allow the user to just save a new node every 5 minutes.
73078
Can someone please tell me how to submit an HTML form when the return key is pressed and if there are no buttons in the form? The submit button is not there. I am using a custom div instead of that.
123115
What's the best way to get a regular anchor (&lt;a href="..."&gt;) to submit the form it is embedded in when clicked?  &lt;form&gt;     &lt;ul&gt;         &lt;li&gt;             &lt;p&gt;                 The link could be &lt;span&gt;embedded &lt;a href="" onclick="?"&gt;at any level&lt;/a&gt;&lt;/span&gt;                 in the form, so "this.parentNode.parentNode..." is no good. :(             &lt;/p&gt;         &lt;/li&gt;     &lt;/ul&gt; &lt;/form&gt;   I know that the easiest way using jQuery would be  $('#myLink').click(function() {     $(this).parents('form:first').submit(); });   ...but I'm trying to find a way to do this without using a library.    Edit: I'm really trying to find a method which doesn't require knowledge of the form (eg: its name, id, etc). This would be similar to how you could put this on an input element: &lt;input onclick="this.form.submit()" /&gt;
85875
I do remember seeing someone ask something along these lines a while ago but I did a search and couldn't find anything.   I'm trying to come up with the cleanest way to clear all the controls on a form back to their defaults (e.g., clear textboxes, uncheck checkboxes).  How would you go about this?