locked
click button and add table row RRS feed

  • Question

  • User1144299848 posted

    Hi Folks,

    The following code adds a row to the table as I click the mouse, but when i release the mouse button the new row vanishes.

    Can anyone help?

    $(document).ready(function () {
        $('.btn-info').click(function () {
            var $newRow = $('tr[data-row="0"]').clone().remove('.btn-info');
            $(this).closest('table > tbody').append($newRow);
        });
    });
      <table class="table-bordered">
            <tr>
                <td style="width: 50%;">
                    <table>
                        <tr>
                            <td colspan="3" style="text-align:center;">
                                <strong>
                                    Sacar
                                </strong>
                            </td>
                        </tr>
                        <tr data-row="0">
                            <td style="vertical-align:bottom;">
                                <button id="maisS" name="maisS" class="btn-info form-control" data-row="0">
                                    <span class="glyphicon glyphicon-plus"></span>
                                </button>
                            </td>
                            <td>
                                Conta
                                @Html.DropDownList("conta", (SelectList)ViewBag.conta, "--selecionar--", htmlAttributes: new { @class = "form-control" })
                            </td>
                            <td>
                                Valor
                                <input type="text" class="dinh form-control" id="val" name="val" />
                            </td>
                            <td style="vertical-align:bottom;"></td>
                        </tr>
                    </table>                
                </td>
                <td style="width:50%;">
                    <table>
                        <tr>
                            <td style="text-align:center;" colspan="3">
                                <strong>
                                    Depositar
                                </strong>
                            </td>
                        </tr>
                        <tr data-row="0">
                            <td colspan="2">
                                Conta
                                @Html.DropDownList("conta", (SelectList)ViewBag.conta, "--selecionar--", htmlAttributes: new { @class = "form-control" })
                            </td>
                            <td>
                                Valor
                                <input type="text" class="dinh form-control" id="val" name="val" />
                            </td>
                            <td style="vertical-align:bottom;">
                                <button id="mais" name="mais" class="btn-info form-control" data-row="0">
                                    <span class="glyphicon glyphicon-plus"></span>
                                </button>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        <br />
        <div>
            <input type="button" class="btn btn-primary" id="btngravar" value="Gravar" />
        </div>
    }
    
    <script src="~/Scripts/Financeiro/MovConta.js"></script>

    TIA

    Moises

    Saturday, May 19, 2018 4:55 PM

Answers

  • User-474980206 posted
    You button is doing a submit, which rerenders the page. Change it to a type=“button” so it does not submit, or in the click handler cancel event bubbling.
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Saturday, May 19, 2018 6:26 PM

All replies

  • User-474980206 posted
    You button is doing a submit, which rerenders the page. Change it to a type=“button” so it does not submit, or in the click handler cancel event bubbling.
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Saturday, May 19, 2018 6:26 PM
  • User1144299848 posted

    Yes that is it. many thanks.

    Saturday, May 19, 2018 7:35 PM