Script JS nefunctional din pagina 2 incarcata cu Ajax

[valy]

Salutare,

In cadrul unei aplicatii web am urmatoarea problema:
- pagina index1.php incarca intr-un div cu ajutorul unui script o alta pagina index2.php.
-a doua pagina contine la randul ei cod javascript /ajax , dar care nu este executat.
- am testat pagina a doua separat si functioneaza, deci problema este la includerea ei in pagina 1.
Dupa 2 zile de cautat solutii, apelez la ajutorul vostru.

In pagina 1 am:

Cod: Selectaţi tot

div class="content-wrapper">
    <div class="container-fluid" id="continut">
    </div>
</div>

<script type="text/javascript">
    $(document).ready(function () {        
        $('a.lnk').click(function () {
            var url = $(this).attr('href');
            $('#continut').load(url);
            return false;
        });
    });
</script>

Pagina 2 inclusa in div contine la randul ei cod html si javascript/ajax cu trimitere la alta pagina pentru operatii CRUD cu mysql.

Salut,
Codurile JS din continut preluat cu Ajax nu sunt executate fiindca acel continut e primit ca un sir.
O astfel de problema, cu rezolvare, este prezentata in tutorialul: coursesweb.net/ajax/execute-javascript-code-ajax-response_t

Gasesti diferite solutii si la cautare pe internet: Execute JavaScript scripts loaded via AJAX.

- Daca nu rezolvi cu ce gasesti, scrie aici si se poate rezolva cu raspunsuri de la cei care au rezolvat astfel de situatii.

Ma depaseste problema. Deci in primul fisier din administrare/index.php am

Cod: Selectaţi tot

<li><a class="lnk" href="contabilitate/facturi/index.php">Facturi</a> </li>

<script type="text/javascript">
    $(document).ready(function () {        
        $('a.lnk').click(function () {
            var url = $(this).attr('href');
            $('#continut').load(url);
            return false;
        });
    });
</script>

In fiserul facturi/index.php preluat in div cu id="continut" am urmatorul script care de fapt prelucreaza un form si apeleaza la un alt fisier numit response.php in care se fac operatii CRUD intr-o baza mysql:

Cod: Selectaţi tot

<script>
    $(document).ready(function () {
        var grid = $("#employee_grid").bootgrid({
            ajax: true,
            rowSelect: true,
            post: function () {
                /* To accumulate custom parameter with the request object */
                return {
                    idFactura: "b0df282a-0d67-40e5-8558-c9e93b7befed"
                };
            },
            url: "../administrator/contabilitate/facturi/response.php",
            formatters: {
                "actiuni": function (column, row) {
                    return "<button type=\"button\" class=\"btn btn-xs btn-default command-edit\" data-row-id=\"" + row.idFactura + "\"><span class=\"glyphicon glyphicon-edit\"></span></button> " +
                        "<button type=\"button\" class=\"btn btn-xs btn-default command-delete\" data-row-id=\"" + row.idFactura + "\"><span class=\"glyphicon glyphicon-trash\"></span></button>";
                }
            }
        }).on("loaded.rs.jquery.bootgrid", function () {
            /* Executes after data is loaded and rendered */
            grid.find(".command-edit").on("click", function (e) {
                //alert("You pressed edit on row: " + $(this).data("row-id"));
                var ele = $(this).parent();
                var g_id = $(this).parent().siblings(':first').html();
                var g_name = $(this).parent().siblings(':nth-of-type(2)').html();
                console.log(g_id);
                console.log(g_name);

                //console.log(grid.data());
                $('#edit_model').modal('show');
                if ($(this).data("row-id") > 0) {

                    // collect the data
                    $('#edit_id').val(ele.siblings(':first').html()); // in case we're changing the key
                    $('#edit_idFur').val(ele.siblings(':nth-of-type(2)').html());
                    $('#edit_codBare').val(ele.siblings(':nth-of-type(3)').html());
                    $('#edit_numar').val(ele.siblings(':nth-of-type(4)').html());
                    $('#edit_serie').val(ele.siblings(':nth-of-type(5)').html());
                    $('#edit_dataScadenta').val(ele.siblings(':nth-of-type(6)').html());
                    $('#edit_dataEmitere').val(ele.siblings(':nth-of-type(7)').html());
                    $('#edit_suma').val(ele.siblings(':nth-of-type(8)').html());
                    $('#edit_descriere').val(ele.siblings(':nth-of-type(9)').html());
                } else {
                    alert('Acum selectati randul! Prima oara selectati randul, apoi apasati butonul editare');
                }
            }).end().find(".command-delete").on("click", function (e) {

                var conf = confirm('Stergeti randul ' + $(this).data("row-id") + ' ?');
                alert(conf);
                if (conf) {
                    $.post('../administrator/contabilitate/facturi/response.php', {
                            idFactura: $(this).data("row-id"),
                            action: 'delete'
                        }
                        , function () {
                            // when ajax returns (callback),
                            $("#employee_grid").bootgrid('reload');
                        });
                    //$(this).parent('tr').remove();
                    //$("#employee_grid").bootgrid('remove', $(this).data("row-id"))
                }
            });

        });

        function ajaxAction(action) {
            data = $("#frm_" + action).serializeArray();
            $.ajax({
                type: "POST",
                url: "../administrator/contabilitate/facturi/response.php",
                data: data,
                dataType: "json",
                success: function (response) {
                    $('#' + action + '_model').modal('hide');
                    $("#employee_grid").bootgrid('reload');
                }
            });
        }
        $("#command-add").click(function () {
            $('#add_model').modal('show');
        });
        $("#btn_add").click(function () {
            ajaxAction('add');
        });
        $("#btn_edit").click(function () {
            ajaxAction('edit');
        });
    });
</script>

E cineva dispus sa ma ajute sa rezolv acest conflict?

Daca si in pagina 2 ai alta apelare cu ajax, lucrurile se complica. Elementele html care sunt folosite in scriptul din pagina 2 trebuie sa fie si ele incluse in pagina 1
Cel mai simplu ar fi sa folosesti <iframe>.
Sa incluzi pagina 2 intr-un <iframe> in pagina 1, cam asa:

Cod: Selectaţi tot

<div id='continut'>continut</div>
<li><a class="lnk" href="contabilitate/facturi/index.php">Facturi</a> </li>

<script>
var a_lnk = document.querySelectorAll('a.lnk');
var continut = document.querySelector('#continut');
for(var i=0; i<a_lnk.length; i++){
 a_lnk[i].addEventListener('click', (e)=>{
  e.preventDefault();
  var url = e.target.getAttribute('href');
  continut.innerHTML ="<iframe src='"+ url +"' style='width:500px; height:400px;'></iframe>";
 });
}
</script>

- Iar din css setezi dimensiunile iframe-ului.