Laravel 4 Ajax和局部视图

问题描述

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

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

将通过JavaScript渲染简单的消息

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

这是我的功能控制器

 公共职能getTeste1（）{
    $ ID =输入::得到（'值'）;
    如果（$ ID ==）
    {
        $这个 - ＆GT;布局 - ＆gt;内容=查看::让（'home.user'）;
    }
    其他
    {
        $这个 - ＆GT;布局 - ＆gt;内容=查看::让（'home.user2'） - ＆gt;在（'新娘子'，$ id）的;
    }
}
 

这是我的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（真正的）;
}
 

这是我的看法：

 ＆LT; H1＆GT;首页＆LT; / H1＆GT;

＆LT; P＆GT;欢迎您的主页。您ROCK＆LT;！/ P＆GT;

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

这是我的部分观点：

  @if（$的IDE！= 0）
＆LT; D​​IV ID =txtHint＆GT; ＆LT; B＆GT;个人信息将被列在这里 - ＆GT; {{$新娘子}}＆LT; / B＆GT;＆LT; / DIV＆GT;
@endif
 

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

感谢您，

贡萨洛·莫拉

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

StateChanged功能：

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

      //警报（的document.getElementById（txtHint）的innerHTML。）;

   }
}
 

jQuery函数：

 ＆LT;脚本＆GT;
$（文件）。就绪（函数（）{
$（＃用户）。改变（函数（）{
  $获得（'的http：//本地主机/ LoginProject /公/家庭/ teste1值='+ $（本）.VAL（），功能（数据）{
    $（＃txtHint）的HTML（数据）。
  }）;
}）;
}）;
＆LT; / SCRIPT＆GT;
 

解决方案

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

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

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

只是让布局变化不大。

  @if（！支持::阿贾克斯（））
＆LT; HTML＆GT;
....
.... //整个布局
＆LT; / HTML＆GT;
@其他
{{$内容}}
@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.

这篇关于Laravel 4 Ajax和局部视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！