Question

I have created a popup which allows users to edit a value then they can submit it again

Html:

<body>
<input id="submit" type="submit" value="Submit" data-theme="b" data-icon="check" data-rel="popup"/>
<div id="success" data-role="popup">
</div>
<div id="fail" data-role="popup">
    <p>Fail</p>
</div>
</body>

jQuery:

$('#submit').click(function(){
    var doStuff = true;
    if(doStuff === true){
        $("#success").empty();
        $("#success").append('<p> <input type="text" value="' + doStuff + '" /> <input type="submit" id="popupConfirm" value="Submit" /> </p>');
        $("#success").popup("open");
    }else{
        $("#fail").popup("open");
    }
});

$('#popupConfirm').click(function(){
    console.log("jhasgd");
});

Currently the click is not working at all that's why I have gibberish in the console.log and also I am not sure how to get the value of the entered input.

So my question is first how can I get the submit click to work and then output what they wrote?

fiddle of the code

Was it helpful?

Solution

$(document).on('click', '#popupConfirm', function(){
    console.log("jhasgd");
});

OTHER TIPS

Where are you adding the jQuery code at? If you are adding it all above the HTML, it might be trying to bind the #submit input before it exists in the DOM. Can you try to wrap the code in a document ready so it won't do the click binding before the DOM gets filled up.

$( document ).ready(function() 
{
    $('#submit').click(function(){
        console.log("clicked the button");
    });
});

Edit: I just saw the comment where you figured this out above. You didn't really have a code solution provided, so I will just leave this as is.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top