Dejell Dejell - 8 months ago 25
CSS Question

Disable click in input in <a> element

I would like to have an input text inside a button like this:

<a onclick="reply_click();" class="btn btn-app btn-app-spinner">
<input type="text" disabled class="form-control small-input">
Set Budget

this is the result:
enter image description here

The problem is that when the user clicks on the input text, the reply_click() is triggered. I would it to be triggered ONLY when he clicks on the a element (Set Bid).

How can I do it?

See jsfiddle

As you can see I want to make it look similar to the buttons in the design as you can see in the JSfiddle


you can do this:

<div class="btn btn-app btn-app-spinner">
      <input type="text" class="form-control small-input">
      <a onclick="reply_click();" >
          Set Budget

In your fiddle replace your html with the html that I provide on the answer and you will have what you want.

The trick is that adding the same classes that you have in your a to another element they are going to look like similar.

Then if you want your action fired when user clicks on the "set budget", wrap it with the <a>