checkbox wrongly marked in Angularjs

Question

checkbox wrongly marked in Angularjs

Navigation

#1 by (3 votes)

3

I have a page in angular that returns a list of results of book copies. The search filters work well, the results are paginated, all without problems. These results have a checkbox on your left, so you can mark several at once and be able, for example, to delete them.

What happens, and it's the weird thing, is that when you mark a couple of them and change pages, the checkboxes go to the next page, when they should not ...

I'm going to put some screenshots to explain myself better

The first page, I frame two results:

Now I change the page, and the checkboxes are still marked, when they should not be:

The page is mounted with symfony, it takes the data of a query in an "action" and it is passed to angular in the template

To retrieve the data, a query is executed, and the json is passed in the following way:

$ejemplares = array();
foreach($data as $ejemplar_bd)
{
    $id_documento = $ejemplar_bd['id_registro'];

    $ejemplar = array();
    $ejemplar['id'] = $ejemplar_bd['id'];
    $ejemplar['idDoc'] = (int)$ejemplar_bd['id_registro'];
    $ejemplar['numregistro'] = (int)$ejemplar_bd['numregistro'];
    $ejemplar['codigo'] = $ejemplar_bd['codigoejemplar'];
    $ejemplar['estado'] = $ejemplar_bd['estado'];
    $ejemplar['signatura'] = $ejemplar_bd['signatura1']."-".$ejemplar_bd['signatura2']."-".$ejemplar_bd['signatura3'];
    $ejemplar['tipo'] =$ejemplar_bd['tipoejemplar'];
    $ejemplar['reservas']=$ejemplar_bd['reservas'];
    $ejemplar['Ubicacion']=$ubicaciones[$ejemplar_bd['id']];
    $ejemplar['Motivo']=$ejemplar_bd['motivo_expurgado'];
    $ejemplar['Editorial']=$data_editorial['valor'];
    $ejemplar['Imprimido']= $ejemplar_bd['imprimido'];
    $ejemplar = array_merge($ejemplar,$fondos[$id_documento][$ejemplar['id']]);

    $ejemplares[] = $ejemplar;

}

$this->json_data = json_encode($ejemplares);

And it's painted on the template like this:

<tr ng-repeat="item in data| filter:Buscar | filtroNumregistro:numregistro | filtroCodEjemplar:codEjemplar | filtroNombreNormalizado:nombreFiltro  | orderBy:sort:reverse | limitTo: (currentPage - 1) * pageSize - filtrados.length | limitTo: pageSize track by $index">
        <td class="sf_admin_text sf_admin_list_td_nombre">
          <input type="checkbox" name="ids[]" value="{{ item.id }}" class="sf_admin_batch_checkbox">
        </td>
        <td class="sf_admin_text">
          {{ item.codigo }}
        </td>
        <td class="sf_admin_text">
          {{ item.numregistro }}
        </td>
        <td class="sf_admin_text sf_admin_list_td_titulo">
            <span><a ng-href="{{cambiarUrlTitulo(item.id)}}">{{ item.Titulo }}</a></span><br/>
            <span class="autorListEjemplar" ng-repeat="autor in item.Autor">{{autor}}{{$last ? '' : ' - '}}</span>
        </td>
        <td class="sf_admin_text" style="width:10%;">
          {{ item.ISBN }}
        </td>
        <td class="sf_admin_text" style="width:10%;">
          {{ item.Editorial }}
        </td>
        <td class="sf_admin_text" style="width:10%;">
          {{ item.Ubicacion }}
        </td>
        <td class="sf_admin_text" style="width:10%;">
          {{ item.signatura }}
        </td>
        <td class="sf_admin_text">
          {{ item.tipo }}
        </td>
      </tr>

What could be happening? Why are checkboxes kept from one page to another?

Thanks

php angularjs

asked by Alex 28.09.2017 в 15:16

source

1 answer

Create JsonResponse UTF-8 in Django Run Backtracking algorithm

score 3 · Accepted Answer

you must change the line

<input type="checkbox" name="ids[]" value="{{ item.id }}" class="sf_admin_batch_checkbox">

for

<input type="checkbox" ng-model="item.checked" class="sf_admin_batch_checkbox">

If you want to know which of your items were marked checked you must go through your array you can simply do it with angular easily: Assuming your fix is in $scope.data

for(let i in $scope.data){
    console.log($scope.data[i].checked);
}

Why?

Angular does not work in the same way as only HTML, it has libraries that modify the DOM to make the life of the programmer "easier" and this to those who start in this world make some common mistakes such as managing forms.