1

I have a problem . My appplication invoke a ajax function and server return an html code button.

Script Angular

.controller('formController', ['$scope','$http', function($scope, $http) {
                   $scope.invia = function() {
                            $http({
                                method: 'POST',
                                url: 'prova.php',
                                data:{url:$scope.nome}
                                  }).then(function successCallback(response) {   
                                   $("#AcquistaButton").remove();
                                   $scope.data1=response.data;  

                                   }, function errorCallback(response) {
                                    $("#AcquistaButton").remove();          
                                    $("#result").html("ERRORE");

                                  });

                                 }


                    }]);

Html code

<form ng-controller="formController" name="myForm" ng-submit="invia()" novalidate>
                 <input type="text" ng-model="nome"
                   name="nomeUtente" ng-maxlength="20"
                   ng-required="true">

                <div ng-show="myForm.nomeUtente.$invalid">
                Il nome utente è obbligatorio e non può superare i 20 caratteri
                </div>
                    <button type="submit" >Invia</button>

     </form>
    <button id="AcquistaButton"  type="submit" value="url" ng-mouseover="acquista ='button_acquista_off.png'" ng-mouseout="acquista ='button_acquista_on.png'" ng-init="acquista='button_acquista_off.png'">
                <img class="img-responsive" ng-srcset="img/{{acquista}}"></button>

                <div id="result"></div>

Find.php

<?php
  $postdata = file_get_contents("php://input");
  $request = json_decode($postdata);
  $utente = $request->utente;

  header("location:button.html"); 
?>

button.php

<button id="RichiediButton"  type="submit" value="url" ng-mouseover="richiedi ='button_Richiedi_off.png'" ng-mouseout="richiedi ='button_Richiedi_on.png'" ng-init="richiedi='button_Richiedi_off.png'">
                    <img class="img-responsive" ng-srcset="img/{{richiedi}}">

                </button>

Why html code that returns the server does not appear ?

I add this filter

.filter("sanitize", ['$sce', function($sce) {
              return function(htmlCode){
                return $sce.trustAsHtml(htmlCode);
              }

and apply with this sintax:

`<div ng-bind-html="data1 | sanitize"></div>

the code is changed but the image is not loaded although the path is correct

Riccardo
  • 26
  • 4
  • 1
    what's the reason to have an entire html returned from the server? Can't you design a template that you can keep client-side and then populate with vars from the server? This is the angular way, a directive that calls a service to populate the fields... – Gianmarco Dec 07 '15 at 14:59
  • This is a simple example. My real app do an ajax call and the server return response found or not found html code . – Riccardo Dec 07 '15 at 15:08
  • then use that var to show or hide a div... no? – Gianmarco Dec 07 '15 at 15:10
  • nono the page server is different for each client call..Server generate the page and return it to client. – Riccardo Dec 07 '15 at 15:14
  • that's old jsp school way of thinking. I don't think that is the correct way to use angularjs – Gianmarco Dec 07 '15 at 15:15
  • Possible duplicate of [AngularJS : Insert HTML into view](http://stackoverflow.com/questions/9381926/angularjs-insert-html-into-view) – nalply Dec 10 '15 at 12:30

0 Answers0