Laravel 4 Ajax和局部视图视图、局部、Laravel、Ajax

2023-09-11 22:30:59 作者:偏差i

即时通讯新与laravel 4日前启动。我的问题很简单,我有一个组合框,客户端和用户的变化,并呈现一个局部的看法。

这是我的第一个观点。的OnChange:

将通过JavaScript渲染简单的消息

我的问题是,如果我把值手动它只会显示部分观点:

这是我的功能控制器

 公共职能getTeste1(){
    $ ID =输入::得到('值');
    如果($ ID ==)
    {
        $这个 - >布局 - >内容=查看::让('home.user');
    }
    其他
    {
        $这个 - >布局 - >内容=查看::让('home.user2') - >在('新娘子',$ id)的;
    }
}
 
前端 AJAX

这是我的javascript函数:

 函数showCustomer(STR)
{
XMLHTTP = GetXmlHttpObject();
如果(XMLHTTP == NULL)
{
警报(您的浏览器不支持AJAX!);
返回;
}
VAR URL =;
URL = + STR值=?;
// URL = URL +&放大器; SID =+的Math.random();
//警报(URL);
xmlHttp.onreadystatechange = stateChanged;
xmlHttp.open(GET,URL,真正的);
xmlHttp.send(真正的);
}
 

这是我的看法:

 < H1>首页< / H1>

< P>欢迎您的主页。您ROCK<!/ P>

<形式GT;
<选择名称=用户的onchange =showCustomer(THIS.VALUE)>
<期权价值=0>选择一个人:其中; /选项>
<期权价值=1>彼得·格里芬< /选项>
<期权价值=2>洛伊丝格里芬< /选项>
<期权价值=3>格伦泥沼< /选项>
<期权价值=4>约瑟夫·斯万森< /选项>
< /选择>
< /形式GT;
< D​​IV ID =txtHint>< / DIV>
 

这是我的部分观点:

  @if($的IDE!= 0)
< D​​IV ID =txtHint> < B>个人信息将被列在这里 - > {{$新娘子}}< / B>< / DIV>
@endif
 

我知道为什么我有这个问题,我不知道如何避免它,如果你们知道这将是非常有益的,或其他客场做到这一点。

感谢您,

贡萨洛·莫拉

编辑: 我用你的解决方案,它会显示如下:

StateChanged功能:

 函数stateChanged()
{
   如果(xmlHttp.readyState == 4)
   {
      的document.getElementById(txtHint)的innerHTML = xmlHttp.responseText。

      //警报(的document.getElementById(txtHint)的innerHTML。);

   }
}
 

jQuery函数:

 <脚本>
$(文件)。就绪(函数(){
$(#用户)。改变(函数(){
  $获得('的http://本地主机/ LoginProject /公/家庭/ teste1值='+ $(本).VAL(),功能(数据){
    $(#txtHint)的HTML(数据)。
  });
});
});
< / SCRIPT>
 

解决方案

我会给你的整体设计更简单的方法。

您不需要控制器来碰任何东西。

带或不带Ajax请求返回相同的观点为。

只是让布局变化不大。

  @if(!支持::阿贾克斯())
< HTML>
....
.... //整个布局
< / HTML>
@其他
{{$内容}}
@endif
 

简单的逻辑。

如果请求没有AJAX,返回该视图与整个模板。

如果请求的是AJAX,只返回视图。

im new with laravel 4 started a few days ago. My problem is simple, i have a combobox which the client or the user changes and renders a "partial" view.

this is my first view. OnChange:

will render that simple message through javascript

my problem is if i place the value "by hand" it will only show the partial view:

this is my function in the controller

    public function getTeste1() {
    $id = Input::get('value');
    if($id=="")
    {
        $this->layout->content = View::make('home.user');
    }
    else
    {
        $this->layout->content = View::make('home.user2')->with('ides',$id);
    }
}

this my javascript function:

function showCustomer(str)
{
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
{
alert ("Your browser does not support AJAX!");
return;
}
var url="";
url="?value="+str;
//url=url+"&sid="+Math.random();
// alert(url);
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(true);
}

this is my view:

<h1>Home</h1>

<p>Welcome to your Home. You rock!</p>

<form>
<select name="users" onchange="showCustomer(this.value)">
<option value="0">Select a person:</option>
<option value="1">Peter Griffin</option>
<option value="2">Lois Griffin</option>
<option value="3">Glenn Quagmire</option>
<option value="4">Joseph Swanson</option>
</select>
</form>
<div id="txtHint"></div>

this is my partial view:

@if($ides!=0)
<div id="txtHint"> <b>Person info will be listed here -> {{ $ides }} </b></div>
@endif

I know why i have this problem, i don't know how to avoid it if you guys know it will be very helpful, or other away to do it.

Thank you,

Gonçalo Moura

EDITED: if i use your solution it will show like this:

StateChanged function:

function stateChanged()
{
   if (xmlHttp.readyState==4)
   {
      document.getElementById("txtHint").innerHTML=xmlHttp.responseText;

      // alert(document.getElementById("txtHint").innerHTML);

   }
}

jquery function:

<script>
$(document).ready(function() {
$("#users").change(function() {
  $.get('http://localhost/LoginProject/public/home/teste1?value=' + $(this).val(),         function(data) {
    $("#txtHint").html(data);
  });
});
});
</script>

解决方案

i will give you a simpler approach for overall design.

you don't need to touch anything in controller.

return the same view for both with or without ajax request.

just make a little change in the layout.

@if(!Request::ajax())
<html>
....
.... //the whole layout
</html>
@else
{{$content}}
@endif

simple logic.

if the request is not ajax, return the view with the whole template.

if the request is ajax, return only the view.