PHPFixing
  • Privacy Policy
  • TOS
  • Ask Question
  • Contact Us
  • Home
  • PHP
  • Programming
  • SQL Injection
  • Web3.0

Tuesday, April 19, 2022

[FIXED] Why does my output content output twice in the blade php?

 April 19, 2022     laravel, php     No comments   

Issue

I am trying to implement live search bar. The live search is working but it however outputs the output content twice, which is annoying. Could you please have a look where the problem is? Thanks.

Here is my code for the search function.

public function search(Request $request)
    {
        if ($request->ajax()) {
            
            $output = "";
            $projects = Project::where('title', 'LIKE', '%' . $request->search . '%')
                        ->where('module_code',$request->module_code)
                        ->get();
            $count = count($projects);
            // $projects = array_unique($projects);
            if ($projects) {
                foreach ($projects as $project) {
                    $output .= '<tr>' .
                        '<td>' . $project->team_number . '</td>' .
                        // '<td>' . $count . '</td>' .
                        '<td>' . $project->lab . '</td>' .
                        '<td>' . '<a href="/projects/' . $project->id . '" style="display:block;"><b>' . $project->title . '</b></a>' . '</td>' .
                        '<td>' . $project-> latest_state. '</td>' .
                        '<td>' . $project->team_member_1 . '</td>' .
                        '<td>' . $project->latest_team_member_1_state . '</td>' .
                        '<td>' . $project->team_member_1 . '</td>' .
                        '<td>' . $project->latest_team_member_1_state . '</td>' .
                        '<td>' . $project->team_member_1 . '</td>' .
                        '<td>' . $project->latest_team_member_1_state . '</td>' .
                        '<td>' . $project->ta . '</td>' .
                        '<td>' . $project->created_at . '</td>' .
                        '<td>' .
                        '<button class="btn-sm btn-info pull-left" onclick="location.href = \'/projects/' . $project->id . '\'">Project Details</button> ' .
                        '</td>' .
                        '</tr>';
                }
                return Response($output);
            }
        }
    }

Here is the script for live search in php blade:

<script type="text/javascript">
    const getQueryParams = (params, url)=>{
        let href = url;
        let regexp = new RegExp('[?&]' + params + '=([^&#]*)', 'i');
        let qString = regexp.exec(href);
        return qString ? qString[1] : null;
    }
    $('#search').on('keyup',function(){
        $value = $(this).val();
        //alert($value);
        $qString = getQueryParams('module', window.location.href);
        $queryString = 
        $.ajax({
            type : 'get',
            url  : '{{URL::to('search')}}',
            data : {'search':$value, 'module_code', $qString},
            success:function (data) {
                //console.log(data);
                //alert(data);
                $('tbody').html(data);
            }
        });
    })
</script>

Here is the code for search bar in php blade

                    <div class="col-sm-5">
                        <input type="text"  class="form-control" id="search" name="search" placeholder="Search..."/>
                    </div>

Before searching: enter image description here

After searching: enter image description here


Solution

Damn, I just found out what's causing the problem. It's kind of silly. The original code is here: https://onecompiler.com/posts/3xy39rm78/php-blade-for-staff, the bug is still up there. The problem was that, I added an additional tag that is unnecessary. The output is placed wherever there is a tag as the script was:

        $('#search').on('keyup',function(){
        $value = $(this).val();
        $qString = getQueryParams('module', window.location.href);
        $queryString = 
        $.ajax({
            type : 'get',
            url  : '{{URL::to('search')}}',
            data : {'search':$value, 'module_code': $qString},
            // data : {'search':$value},
            success:function (data) {
                //console.log(data);
                // alert(data);
                $('tbody').html(data);
            }
        });
    })

At the very last bit of the code, it tells html to print result at the tag(I'm not sure if this is right). By deleting the additional tbody tag, the problem was solved.



Answered By - JPPPPP
Answer Checked By - Dawn Plyler (PHPFixing Volunteer)
  • Share This:  
  •  Facebook
  •  Twitter
  •  Stumble
  •  Digg
Newer Post Older Post Home

0 Comments:

Post a Comment

Note: Only a member of this blog may post a comment.

Total Pageviews

Featured Post

Why Learn PHP Programming

Why Learn PHP Programming A widely-used open source scripting language PHP is one of the most popular programming languages in the world. It...

Subscribe To

Posts
Atom
Posts
Comments
Atom
Comments

Copyright © PHPFixing