Check the form to see whether there is a `HTMLInputElement` with id or name is `submit`.

This will set a property `submit` to the `HTMLFormElement`, so the `submit` function which is in the prototype of the form element can&#39;t be executed.

***Example:***

    &lt;form class=&quot;form&quot; id=&quot;form&quot; action=&quot;/mailer.php&quot; method=&quot;post&quot;&gt;
        ​&lt;input type=&quot;button&quot; name=&quot;submit&quot; value=&quot;go&quot;/&gt;
    &lt;/form&gt;​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
js:

    ​console.log($(&quot;#form&quot;)[0].submit)​;​  // will be the button element, not the submit function.


jQuery&#39;s `.submit()` method will call the `.submit()` on the original dom element, so the error will happen.


**xdazz** explained the issue well.

You can use a native **submit** method of HTMLFormElement to work around a problem:

    HTMLFormElement.prototype.submit.call($(&#39;#form&#39;)[0]);

If you have a button or input with the name submit or id submit, I have seen errors in IE. Make sure your inputs are correctly named. Here&#39;s an article on it http://bugs.jquery.com/ticket/1414

Example use:

    def f(a, b, c, d): 
        print(a, b, c, d, sep = &#39;&amp;&#39;)
    
    f(1,2,3,4)
    &gt;&gt;&gt; 1&amp;2&amp;3&amp;4

    f(*[1, 2, 3, 4])
    &gt;&gt;&gt; 1&amp;2&amp;3&amp;4

Where in the python documentation is `*` explained?

Python 3: starred expression to unpack a list

Programming in `C` I used to have code sections only used for debugging purposes (logging commands and the like). Those statements could be completely disabled for production by using `#ifdef` pre-processor directives, like this:

     #ifdef MACRO
     
     controlled text
     
     #endif /* MACRO */

What is the best way to do something similar in `python`?

How do you implement &quot;#ifdef&quot; in python?

Can anyone explain to me what this error means? I would appreciate it a lot for any kindof help with this.


    &lt;form class=&quot;form&quot; id=&quot;form&quot; action=&quot;/mailer.php&quot; method=&quot;post&quot;&gt;

The Jquery code I&#39;m using for it is this.

    $(&#39;#form&#39;).submit();  

Property &#39;submit&#39; of object #&lt;HTMLFormElement&gt; is not a function

Can anyone explain to me what this error means? I would appreciate it a lot for any kindof help with this.
<pre><code class="hljs language-ini">&#x3C;form class="form" id="form" action="/mailer.php" method="post">
</code></pre>
The Jquery code I'm using for it is this.
<pre><code class="hljs language-javascript">$('#form').submit(); 
</code></pre>

Some places seem to use the controller function for directive logic and others use link. The tabs example on the angular homepage uses controller for one and link for another directive. What is the difference between the two? 

Difference between the &#39;controller&#39;, &#39;link&#39; and &#39;compile&#39; functions when defining a directive

I would like to know if JavaScript has &quot;short-circuit&quot; evaluation like &amp;&amp; Operator in C#. If not, I would like to know if there is a workaround that makes sense to adopt.
 

Does JavaScript have &quot;Short-circuit&quot; evaluation?

I have read many posts on SO and the web regarding the keywords in my question title and learned a lot from them. Some of the questions I read are related to specific implementation challenges while others focus on general concepts. I just want to make sure I understood all of the concepts and the reasoning why technology X was invented over technology Y and so on. So here goes:

**Http Polling:** Basically AJAX, using XmlHttpRequest.

**Http Long Polling:** AJAX but the server holds on to the response unless the server has an update, as soon as the server has an update, it sends it and then the client can send another request. Disadvantage is the additional header data that needs to be sent back and forth causing additional overhead.

**Http Streaming:** Similar to long polling but the server responds with a header with &quot;Transfer Encoding: chunked&quot; and hence we do not need to initiate a new request every time the server sends some data (and hence save the additional header overhead). The drawback here is that we have to &quot;understand&quot; and figure out the structure of the data to distinguish between multiple chunks sent by the server.

**Java Applet, Flash, Silverlight:** They provide the ability to connect to socket servers over tcp/ip but since they are plugins, developers don&#39;t want to depend on them.

**WebSockets:** they are the new API which tries to address the short comings of above methods in the following manner:

 - The only advantage of WebSockets over plugins like Java Applets, Flash or Silverlight is that WebSockets are natively built into browsers and does not rely on plugins.
 - The only advantage of WebSockets over http streaming is that you don&#39;t have to make an effort to &quot;understand&quot; and parse the data received.
 - The only advantage of WebSockets over Long Polling is that of elimination of extra headers size &amp; opening and closing of socket connection for request.

Are there any other significant differences that I am missing? I&#39;m sorry if I am re-asking or combining many of the questions already on SO into a single question, but I just want to make perfect sense out of all the info that is out there on SO and the web regarding these concepts.

Thanks!

My Understanding of HTTP Polling, Long Polling, HTTP Streaming and WebSockets

So basically I&#39;d like to remove the class from &#39;header&#39; after the user scrolls down a little and add another class to change it&#39;s look.

Trying to figure out the simplest way of doing this but I can&#39;t make it work.


    $(window).scroll(function() {    
        var scroll = $(window).scrollTop();    
        if (scroll &lt;= 500) {
            $(&quot;.clearheader&quot;).removeClass(&quot;clearHeader&quot;).addClass(&quot;darkHeader&quot;);
        }
    }

CSS

    .clearHeader{
        height: 200px; 
        background-color: rgba(107,107,107,0.66);
        position: fixed;
        top:200;
        width: 100%;   
    }    
    
    .darkHeader { height: 100px; }
       
    .wrapper {
        height:2000px;
    }

HTML

    &lt;header class=&quot;clearHeader&quot;&gt;  	&lt;/header&gt;
    &lt;div class=&quot;wrapper&quot;&gt;     &lt;/div&gt;


I&#39;m sure I&#39;m doing something very elementary wrong.


Add/remove class with jquery based on vertical scroll?

I am trying to create a custom helper using Meteor.  Following to the doc here:
https://github.com/meteor/meteor/wiki/Handlebars

I have tried to define my helper as follows:

    Template.myTemplate.testHelper = function(foo, bar, options) {
        console.log(foo);
        console.log(bar);
    }

My template looks like:

    &lt;template name=&quot;myTemplate&quot;&gt;
        {{#testHelper &quot;value1&quot; &quot;value2&quot;}}
        {{/testHelper}}
    &lt;/template&gt;

Looking at my console output, I expected to see 2 lines of output:

    value1
    value2

However my console looks like:

    value1
    function (data) {
        // don&#39;t create spurious annotations when data is same
        // as before (or when transitioning between e.g. `window` and
        // `undefined`)
        if ((data || Handlebars._defaultThis) ===
            (old_data || Handlebars._defaultThis))
          return fn(data);
        else
          return Spark.setDataContext(data, fn(data));
      } 

Note, I am completely new to meteor, and to handlebars.  I think I would be much happier using underscore, but the documentation for meteor glances over underscore almost entirely.  Am I doing something wrong defining my helper function?  It seems that it is not seeing the second parameter &quot;bar&quot;, and instead interpreting that as the options.  (Note: if I console.log(options) it returns &#39;undefined&#39;).

Meteor version 0.4.0 (8f4045c1b9)

How to use multiple parameters in a handlebar helper with meteor?

How can I get the file size, image height and width before upload to my website, with jQuery or JavaScript?

Get file size, image width and height before upload

I&#39;m trying to make bootstrap twitter dialog modal draggable with this jquery plugin:

 http://threedubmedia.com/code/event/drag#demos

but it doesn&#39;t work.

    var $div = $(&#39;html&#39;);
    console.debug($(&#39;.drag&#39;));
    $(&#39;#modalTest&#39;)
        .drag(&quot;start&quot;, function(ev, dd) {
            dd.limit = $div.offset();
            dd.limit.bottom = dd.limit.top + $div.outerHeight() - $(this).outerHeight();
            dd.limit.right = dd.limit.left + $div.outerWidth() - $(this).outerWidth();
        })
        .drag(function(ev, dd) {
            $(this).css({
                top: Math.min(dd.limit.bottom, Math.max(dd.limit.top, dd.offsetY))
                , left: Math.min(dd.limit.right, Math.max(dd.limit.left, dd.offsetX))
            });
        }); 

         

Have you idea how can I do it?



make bootstrap twitter dialog modal draggable

I am making a phonegap application with jquery. I am confused whether I should wrap my entire code inside JQuery&#39;s `$(document).ready()` like

    $(document).ready(function(){
        //mycode
    });

or inside the deviceready event of phonegap like

    document.addEventListener(&quot;deviceready&quot;, function(){
        //mycode
    });

I am currently using `document.ready` but I think I may encounter problems if I try to access some Phonegap API methods inside `document.ready`.

Which is the best event to wrap my code in, document.ready or deviceready?

JQuery document.ready vs Phonegap deviceready

When trying to show a div element with jQuery, i got this error:

    [23:50:35.971] TypeError: p.easing[this.easing] is not a function @ file:///D:/html5%20puzzle/jquery.js:2

The relevant function is this:

    function showWithAnimation(){     			   
      console.log(&#39;animation called&#39;);
      $(&#39;#popup&#39;).show();
      $(&quot;#popup&quot;).css({&quot;top&quot;: &quot;30%&quot;, &quot;left&quot;: &quot;30%&quot;})
                 .animate({top:(($(window).height()/2)-($(&#39;#popup&#39;)
                 .outerHeight()/2))-70}, 1000, &#39;easeOutBounce&#39;)
                 .show();
    }

The function is responsible of showing the div with a bounce animation, however, the div is shown but without bounce effect.


**EDIT:**

I am including jQuery and jQueryUI libraries from a CDN like this (In order):

    &lt;script src=&#39;http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js&#39;&gt;&lt;/script&gt;
    &lt;script src=&#39;http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js&#39;&gt;
    &lt;/script&gt;


    



TypeError: p.easing[this.easing] is not a function

For efficiency purposes I am wondering if a file or text in a textarea still gets transferred to the server if you omit the name attribute or set it to null. eg

    &lt;input type=&quot;file&quot; id=&quot;file&quot; name=&quot;&quot;&gt;
    &lt;textarea id=&quot;text&quot; name=&quot;&quot;&gt;

I notice that the data is not available at the server if you do this.

Does form data still transfer if the input tag has no name?

I have three controls on my web form of three drop down lists.

I want to create a graphical &quot;box&quot; around these controls. The reason for this is that selecting these controls would be &quot;STEP 1&quot; of my process. So I want to put a box around these controls and call it &quot;Step 1&quot;

How would I go about doing this with CSS?

Example:

&gt; ![box around form elements](http://i.imgur.com/qsGAb.png)

Create a group box around certain controls on a web form using CSS

In my HTML below, when I hover on the `&lt;a&gt;` element I want to change the colour of the `&lt;h1&gt;` element using only CSS. Is there a way to achieve this?

```html
&lt;h1&gt;Heading&lt;/h1&gt;
&lt;a class=&quot;button&quot; href=&quot;#&quot;&gt;&lt;/a&gt;
```


What if I wrap a div around it with an id in it?
```html
&lt;div id=&quot;banner&quot;&gt;
    &lt;h1&gt;Heading&lt;/h1&gt;
    &lt;a class=&quot;button&quot; href=&quot;#&quot;&gt;&lt;/a&gt;
&lt;/div&gt;
```

Will this help?

Change color of sibling elements on hover using CSS

I would like to implement a mask for a text `input` field which accepts a date. The masked value should display directly inside of the `input`.

Something like this:

    &lt;input type=&#39;text&#39; value=&#39;____/__/__&#39;&gt;

I wrote the mask as a value in that example, but my intent is to allow people to write a date without typing `/` or `-` to separate months, years and days. The user should be able to enter numbers into the displayed field, while the mask enforces the format automatically as the user types.

I have seen this behavior on other sites, but I have no idea how it works or how to implement it myself.

Implement an input with a mask

I&#39;m making a form. And on one `input` tag is an `OnClick` event handler, which is opening a popup, where you can choose some stuff, and then it autofills the `input` tag.

That input tag is also `readonly`, so only right data will be entered.

This is the code of the `input` tag:

    &lt;input type=&quot;text&quot; name=&quot;formAfterRederict&quot; id=&quot;formAfterRederict&quot; size=&quot;50&quot; required readonly=&quot;readonly&quot; OnClick=&quot;choose_le_page();&quot;  /&gt;

But the `required` attribute isn&#39;t working in Chrome. But the field is required.

Does anybody know how I can make it work?

HTML required readonly input in form

Just looking to remove these arrows, convenient in certain situations.

I would like to preserve the browser&#39;s awareness of the content being purely numeric however. So changing it to `input[type=&quot;text&quot;]` is not an acceptable solution.

-------

Now that Opera is webkit based, this question is a dulpicate of: https://stackoverflow.com/questions/3790935/can-i-hide-the-html5-number-inputs-spin-box

How to remove the arrows from input[type=&quot;number&quot;] in Opera

I&#39;ve written the following piece of code in my nodeJS/Expressjs server:

```
app.post(&#39;/settings&#39;, function(req, res){
	var myData = {
		a: req.param(&#39;a&#39;)
		,b: req.param(&#39;b&#39;)
		,c: req.param(&#39;c&#39;)
		,d: req.param(&#39;d&#39;)
	}

	var outputFilename = &#39;config.json&#39;;

	fs.writeFile(outputFilename, JSON.stringify(myData, null, 4), function(err) {
		if(err) {
		  console.log(err);
		} else {
		  console.log(&quot;Config file as been overwriten&quot;);
		}
	}); 
});
```

This allows me to get the submitted form data and write it to a JSON file.

This works perfectly. But the client remains in some kind of posting state and eventually times out. So I need to send some kind of success state or success header back to the client. 

How should I do this?

Thank you in advance!

How can I send a success status to browser from nodejs/express?

Suppose we&#39;re building an address book application (contrived example) with AngularJS.

We have a form for contacts that has inputs for email and phone number, and we want to require **one or the other**, but **not both**: We only want the `email` input to be required if the `phone` input is empty or invalid, and vice versa.

Angular has a `required` directive, but it&#39;s not clear from the documentation how to use it in this case. So how can we conditionally require a form field? Write a custom directive?


How can I conditionally require form inputs with AngularJS?

I&#39;m just learning javascript and php.  I created a contact form and I&#39;d like the submit button to accomplish two things when I press it:

 1. submit the data to me (this part is working)
 2. read my onclick function (this part is not working)

&lt;!-- --&gt;

    &lt;input id=&quot;submit&quot; name=&quot;submit&quot; type=&quot;submit&quot; value=&quot;Submit&quot; onclick=&quot;eatFood()&quot;&gt;

    &lt;?php
    if ($_POST[&#39;submit&#39;]) {
     ////????? 
    }
    ?&gt;

I&#39;m sending the data to my email, and so I get that.  But the `onclick` function doesn&#39;t seem to work.  I tried reviewing [https://stackoverflow.com/questions/5356011/add-onclick-function-for-submit-button][1] but it didn&#39;t help.

  [1]: https://stackoverflow.com/questions/5356011/add-onclick-function-for-submit-button

add onclick function to a submit button

I want a submit type button to send a POST request.

I am thinking about something like this:

```
&lt;form action = &quot;&quot; method = &quot;post&quot;&gt;
    &lt;button&gt;Upvote&lt;/button&gt;
&lt;form&gt;
```

where the string &quot;Upvote&quot; will be send as a name in the POST request.

I know this is not working, and I know there are ways using AJAX(javascript) but I am fairly new to this area. I am just wondering if this is possible in general.

**Update**

Someone suggested using the `&lt;input&gt;` tag, and I tried it. The problem is it generates a GET rather than a POST.

Can a HTML button perform a POST request?

I&#39;m setting up a form wherein I need two &quot;actions&quot; (two buttons):

1 - &quot;Submit this form for approval&quot;&lt;br&gt;
2 - &quot;Save this application for later&quot;

How do I create an HTML form that supports multiple &quot;actions&quot;?

EG:

`&lt;form class=&quot;form-horizontal&quot; action=&quot;submit_for_approval.php&quot;&gt;`&lt;br&gt;
`&lt;form class=&quot;form-horizontal&quot; action=&quot;save_for_later.php&quot;&gt;`

I need to combine these two options-for-submitting into one form.

I did some basic research but couldn&#39;t find a definitive answer as to whether or not this is possible, and/or any good resources to links for a workaround.

Thanks in advance.

HTML form with multiple &quot;actions&quot;

I am learning web development using `Django` and have some problems in where to put the code taking chage of whether to submit the request in the `HTML code`.

Eg. There is webpage containing a `form`(a blog) to be filled by the user, and upon click on the Save button,there is a pop up asking whether you want to `confirm` or not. If click on `confirm`, then the request is sent.

I searched and find this `javascript` code.

    &lt;script type=&quot;text/javascript&quot;&gt;
    function clicked() {
        alert(&#39;clicked&#39;);
    }
&lt;/script&gt;

    &lt;input type=&quot;submit&quot; onclick=&quot;clicked();&quot; value=&quot;Button&quot; /&gt;

But I guess this is not the correct function as it seems to me that whenever you click on the Button, the request will be submitted. So How can I delay the submit request until user has confirm the submit?


HTML - How to do a Confirmation popup to a Submit button and then send the request?

Let&#39;s say I have an `input` in a form (looks like a button and interacts like a button) which generates some data (well, the server generates the data based on the form parameters, but for the user, the button does it :) )based on the parameters in the form.

When I use `click()`, the whole process hangs (it actually freezes, no exceptions or errors).

From the Selenium website:

    // Now submit the form. WebDriver will find the form for us from the element
    element.submit();
So WebDriver has a `submit()` method. Is there any difference, logic wise, between using a `click()` on a button or `submit()` ? 

Content Type	Original Author	Original Content on Stackoverflow
Question	Andrew Allen West	View Question on Stackoverflow
Solution 1 - Javascript	xdazz	View Answer on Stackoverflow
Solution 2 - Javascript	ainokna	View Answer on Stackoverflow
Solution 3 - Javascript	Alex Reynolds	View Answer on Stackoverflow

Property 'submit' of object #<HTMLFormElement> is not a function

Javascript Problem Overview

Javascript Solutions

Solution 1 - Javascript

Solution 2 - Javascript

Solution 3 - Javascript

How do you implement "#ifdef" in python?

Python 3: starred expression to unpack a list

Attributions