CODEWITHSUNDEEP
javascriptjqueryhtml
AnonyMouse
AnonyMouse

Reputation: 18650

radio button how to pre select value with the value determined in the function

I have a method like:

$('.officeapprovalspan').click(function () {

        var invoicelineid = $(this).data("invoicelineid");

        var approval = $(this).data("approval");

        $(this).replaceWith('<input type="radio" name="variety" value="null" class="radioapproval" data-invoicelineid=' + invoicelineid + ' /><span class="pleaseapprove">Please Accept</span><br >' +
                    '<input type="radio" name="variety" value="false" class="radioapproval" data-invoicelineid=' + invoicelineid + ' /><span class="onhold">On Hold</span><br >' +
                    '<input type="radio" name="variety" value="true" class="radioapproval" data-invoicelineid=' + invoicelineid + ' /><span class="accepted">Accepted</span>');

        $(document).on('change', '.radioapproval', radiohandler);
    });

So, I have the three radio buttons. What I want to achieve is based on the value of the variable approval preselect the appropriate radio button. Approval will have the value null, false or true.

Can someone please tell me how you would write this given I'm adding it with the replaceWith

Upvotes: 0

Views: 787

Answers (1)

Darin Dimitrov
Darin Dimitrov

Reputation: 1039228

Try using .html():

var invoicelineid = $(this).data("invoicelineid");
var approval = $(this).data("approval");

$(this).html(
    '<input type="radio" name="variety" value="null" class="radioapproval" data-invoicelineid=' + invoicelineid + ' /><span class="pleaseapprove">Please Accept</span><br >' +
    '<input type="radio" name="variety" value="false" class="radioapproval" data-invoicelineid=' + invoicelineid + ' /><span class="onhold">On Hold</span><br >' +
    '<input type="radio" name="variety" value="true" class="radioapproval" data-invoicelineid=' + invoicelineid + ' /><span class="accepted">Accepted</span>'
)
.find(':radio[name="variety"][value="' + approval + '"]')
.prop('checked', true);

For example if the value of the approval variable is true the last radio button will be selected.

Upvotes: 2

Related Questions