CODEWITHSUNDEEP
jqueryhtml
Yunus Aslam
Yunus Aslam

Reputation: 2466

contenteditable="true" not working on a button element

I have the following button

<button data-shq-name="Submit Button" data-shq-id="submit-text" type="submit" data-shq-type="editable-text" class="btn">Get Instant Access</button>

Onclick of this button I am adding contenteditable="true" with jquery. The attribute is getting added fine, but contenteditable is not working. If I already place this attribute in the button tag then it works.

I want it to work when we click on the button and the text becomes editable so that I can save the edited text.

I am doing jquery stuff like this

$(".btn").click(function(){
    $(this).attr("contenteditable", true);
});

Any Help Please.

Upvotes: 0

Views: 1905

Answers (1)

Salathiel Genese
Salathiel Genese

Reputation: 1909

This code work in `chrome browser'

        <button type="button" contenteditable="true">
            A button
        </button>

But for this type="submit" works too, but then, the action submit is called. Thus you should prevent the second action with javascript code...

    <form method="POST" action="#">
        <button type="submit" contenteditable="true">
            A button
        </button>
    </form>

--

     $(function() {
        $('button').click(function(event) {
            event.preventDefault();
        });
    });

Upvotes: 0

Related Questions