Hashaam Ahmed
Hashaam Ahmed

Reputation: 340

input type date is not dynamically adding in table, Javascript

I am adding rows to table dynamically, among those textboxes and I have textbox with type date which is not dynamically adding. Please help me out with JS. All the textboxes adds fine except for the textboxes with type DATE.

JS:

function addField (argument) {
    var myTable = document.getElementById("myTable");
    var currentRow = myTable.insertRow(-1);

    var line_part_numberBox = document.createElement("input");
    line_part_numberBox.setAttribute("name", "line_part_number[]");

    var line_dateBox = document.createElement("input");
    line_dateBox.setAttribute("name", "line_date[]");

    var addRowBox = document.createElement("input");
    addRowBox.setAttribute("type", "button");
    addRowBox.setAttribute("value", "Add another line");
    addRowBox.setAttribute("onclick", "addField();");
    addRowBox.setAttribute("class", "button");

    var currentCell = currentRow.insertCell(-1);
    currentCell.appendChild(line_part_numberBox);

    currentCell = currentRow.insertCell(-1);
    currentCell.appendChild(line_dateBox);
}

Blade:

<table class="table table-striped" id="myTable">
    <thead>
        <tr>
            <th>heading1</th>
            <th>heading2</th>
            <th>action</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th>{{ Form::text('line_part_number[]', null , ['class' => 'form-control']) }}</th>
            <th>{{ Form::date('line_date[]', null , ['class' => 'form-control']) }}</th>
            <th><input type="button" class="button" value="Add another line" onclick="addField();"></th>
        </tr>
    </tbody>
</table>

Upvotes: 1

Views: 99

Answers (1)

somsgod
somsgod

Reputation: 357

This code will work for you , i have tested it on my end working fine.

var date_input = document.createElement("input");
date_input.setAttribute("type", "date");
currentCell.appendChild(date_input);

Upvotes: 1

Related Questions