Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
  1. It's loading when I type a char in input type="search".
  2. Page is calling 'ajax call' twice. request is fire twice on 'single click' or 'onPageload'

index.Html

This is my html file which has a search box

<div>
    <div class="input-group">
        <input type="search" class="form-control search" ng-model="searchtag" tabindex="1">
        <div class="input-group-btn">
            <button class="btn btn-default" type="submit" ng-click="search()"></button>
        </div>
        <ng-view></ng-view>
    </div>

This search box is not attached than why is this so silly thing happening??

template url is loading in this ng-view


index.js file:

Here I have defined a configuration of routing for template url.

angular.module("myApp", ['ngRoute'])
    .config(["$routeProvider", function($routeProvider) {
        $routeProvider.
            when("/", { templateUrl: "pic.html" }).
            when("/Search", { templateUrl: "pic.html" }).
            when("/VipList", { templateUrl: "cust.html" }).
            otherwise({ redirectTo: "/", templateUrl: "pic.html" });
    }]
    )

Here I have created a service which call send the ajax call to server and returns back a json object. Calling ajax call twice on each request and returning two 'Json' data object.

.factory('Search', [function($http, $scope) {
    return {
        fetchPopular: function($scope, callback) {

            $.ajax({
                type: "POST",
                url: 'Search',
                data: {search : $scope.globeSearch},
                dataType: 'json'
            }).
                success(function(data, status, headers, config) {
                    console.log(data);
                    if(data.data.length<=0){
                        alert("No data found");
                    }
                    callback(data.data);
                })
                .error(function(data, status, headers, config) {
                });
        }
    };
}
])

.controller("fetch", function($scope, $interval, $location, Search) {

    $scope.globeSearch="Sachin";

    $scope.pics = [];
    $scope.have = [];
    $scope.orderBy = "-comments.count";
    $scope.getMore = function(callback) {
        Search.fetchPopular($scope, function(data) {

            for(var i=0; i<data.length; i++) {
                if (typeof $scope.have[data[i].id]==="undefined") {
                    $scope.pics.push(data[i]) ;
                    $scope.have[data[i].id] = "1";
                }
            }
            $location.path("/Search");
        });
    };


    $scope.getMore();

    $scope.searchPopular = function(callback) {

        if($scope.searchStr!=null && $scope.searchStr!=""){ $scope.globeSearch=$scope.searchStr; }

        $scope.pics = [];
        $scope.have = [];
        $scope.orderBy = "-comments.count";
        Search.fetchPopular($scope, function(data) {
            for(var i=0; i<data.length; i++) {
                if (typeof $scope.have[data[i].id]==="undefined") {
                    $scope.pics.push(data[i]) ;
                    $scope.have[data[i].id] = "1";
                }
            }
            $location.path("/Search");
        });
    };
share|improve this question
    
Its resolved now. need to add '$location.apply()' after setting location path. –  GeekAbhiGeek Apr 28 at 10:07
    
Whoa. I'm not so sure. $location.apply() implies that you're having to kick off the digest cycle again. It might work, but that means that your Angular application isn't behaving correctly. You may be opening yourself up to a larger bug later on. –  Vishal Kotcherlakota Apr 29 at 0:25
add comment

1 Answer

I'm having a hard time understanding what you're doing here, but I can see at least a few problems.

I'm not seeing code for a controller, nor am I seeing any templates. In order for your routing to work, the application's route needs to change (ideally inside your app's controllers). For example, if inside a controller you called $location.path('/Search'), angular would load the associated template and invoke the controller.

If you wouldn't mind putting a live demo up on Plunker or JSFiddle, I'm sure you could get some more meaningful help.

EDIT

I see your biggest problems off the bat. Let's look again at your routing configuration.

angular.module("myApp", ['ngRoute'])
    .config(["$routeProvider", function($routeProvider) {
        $routeProvider.
            when("/", { templateUrl: "pic.html" }).
            when("/Search", { templateUrl: "pic.html" }).
            when("/VipList", { templateUrl: "cust.html" }).
            otherwise({ redirectTo: "/", templateUrl: "pic.html" });
    }]
    )

You're not specifying any controllers within your routes. in order for the search code to get executed, you need to invoke your Search factory within a child controller. Also, Your first route is redundant with your otherwise() call.

This Plunker taken from the AngularJS documentation should help you out.

share|improve this answer
    
Vishal I have not posted code of controller n templates here. Though I have written code for both. I give %location.path('Search') inside the function call in controllers. –  GeekAbhiGeek Apr 24 at 18:31
    
I'll say it again. If you don't share more of your code, or at least a similar example, I don't think you'll get much help. :-) You need to give people stuff to work with. –  Vishal Kotcherlakota Apr 24 at 21:25
    
I have added more data here please see and help. Im stuck here... Thank you!!! :) –  GeekAbhiGeek Apr 25 at 5:31
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.