Manually trigger click event on other DOM element in knockout viewmodel page

Question

In my html:

<input type="image" src="http://placehold.it/145x145" data-bind="click: imgClick"/>
<input type="file" id="artImage" style="display: none;" />

In my viewmodel:

var imgClick = function () {
    $("artImage").click();
};

If I put a debug breakpoint on the '$("artImage").click()' line, it is hit. I get no error in the console, nothing happens on screen though.

Seems to work ok in a fiddle? http://jsfiddle.net/nVrSP/ so I'm not sure why it's not working on my page.

(in case anyone asks, I'm trying to do a clickable image to trigger a file upload browse)

$("input[id='artImage']") is in your fiddle but $("artImage") is in your post... you should probably be using $("#artImage") (ids should be unique) — user3334690, Mar 12 '14 at 15:43

JF it · Accepted Answer · 2014-03-12T16:12:33.307

2

your selector is probally returning nothing as you have not given it a # to say "this is ID."

try

$("#artImage").trigger('click');

edited Mar 12 '14 at 16:12

answered Mar 12 '14 at 15:46

JF it

[.click](http://api.jquery.com/click/) "Bind an event handler to the "click" JavaScript event, or trigger that event on an element." – user3334690 Mar 12 '14 at 15:48
ok thanks @user3334690 .. never used it that way :) ill update answer. – JF it Mar 12 '14 at 16:12
Nice one, can't believe I missed that obvious one! – TheMook Mar 12 '14 at 17:50

score 0 · Answer 2 · edited May 23 '17 at 11:54

0

Dude, it is a security measure from the vast majority of browsers to do nothing on "click" event if the html file input control is hidden.

A workaround for this is to hide the file input control using opacity, do not hide it using visibility or display=none.

See this thread for more info:

edited May 23 '17 at 11:54

Community

answered Mar 12 '14 at 16:22

Adrian Salazar

Hmm. Well, the solution above worked for me and firefox definitely does allow it (and so does Chrome!). Thanks for the input though, appreciated. – TheMook Mar 12 '14 at 17:50

2 Answers2