0

我正在使用 openinviter 从 gmail 中检索联系人，效果很好。但是，当我使用 jquery 和 ajax 调用来提交检索联系人的表单时 smarty 不会呈现。似乎 smarty 只呈现我不想做的页面重新加载。所以，我的问题是如何在 jquery ajax 调用之后进行 smarty 渲染？

jquery ajax 调用

$(document).ready(function(){
 $('input[name="Submit"]').click(function() { 
 var query = $('#frmContact').serialize();
  $.ajax({type: "POST",url: "google_friends.php",data: query,cache: false,success:function (html) $('#errid').html('<span style="font-size:12px; font-family:Arial, Helvetica, sans-serif; color:#FF0000;">'+html+'</span>').show();}});        
    return false;});});
</script>

    <div>
    <!--- Smarty code that needs to render after jquery ajax call -->
    {if count($contacts) == 0 }
     <span id="errid" >{$msg}</span>
       <p>
     <!-- Form that is used by jquery ajax -->

    <form class="Form StaticForm" id="frmContact" action="" name="frmContact" method="post">
    <input type="hidden" name="provider_box" value="gmail" />
                <ul>
                    <li>
                       <input type="text" name="email_box" value="email" onBlur="if      (this.value=='') this.value='email';" onFocus="if(this.value=='email') this.value='';" />
                    </li>
                    <li>
                       <input type="password" name="password_box" value="password" onBlur="if(this.value=='') this.value='password';" onFocus="if(this.value=='password') this.value='';"  />
                    </li>

                    <li class="noBorderTop"><input class="Button WhiteButton Button18 trueB" type="button" value="Submit" name="Submit" />
                        <label>
                            &nbsp;</label>
                    </li>
                </ul>
                </form>       
    </p>
         <!-- smarty code that needs to render after ajax call -->
         {else}
         <span id="errid" ></span>
          <p>
         <form class="Form StaticForm2" action="" name="invtfrm" method="post">
               <ul>
                    <li style="float:left;margin-left:120px;">                          
                    <input type="checkbox" name="checkall" onClick="return doCheckAll();" style="vertical-align:0" />&nbsp;Select All

                    </li>
                    <li style="float:left;"><div class="box-dividerCenter1 gradient"></div></li>  
             <!-- smarty code that needs to render after ajax call -->   
             {foreach from=$contacts key=fkey item=fval}

                <li style="float:left;margin-left:120px;">                          
                    <input type="checkbox" name="email[]" value="{$fkey}"  style="vertical-align:0"/>&nbsp; 
            <!-- smarty code that needs to render after ajax call -->
                {$fval}&nbsp;&nbsp;&nbsp;&nbsp;{$fkey}

                    </li>   
                       <li style="float:left;"><div class="box-dividerCenter1 gradient"></div></li>     
           {/foreach}
            <li class="noBorderTop"><a class="Button WhiteButton Button18" href="#" id="sbmtbtn" ><strong>Invite</strong><span></span></a></li>
    {/if}
    </ul>
    </form>

4

1 回答 1

2

您的假设存在逻辑错误。

Smarty仅在页面实际加载（或重新加载）时使用，而不是在响应使用 jQuery（或其他 js 框架）的 ajax 请求时使用。基本上，该变量$contacts只会在页面加载时被检查，而不是因为您的 javascript 代码中的一些响应事件。

使用 ajax 技术的主要原因之一实际上是避免重新加载页面。

两种更好的方法：

  1. 使用您的 javascript 更改您的 html 容器的内容。.ajaxComplete()的jquery 手册部分有一些关于如何执行此操作的示例。只需声明一些空的 div 容器并用您想要的数据填充它们。
  2. 您还可以通过 ajax ( fetch()-method ) 获取整个 smarty-template 并返回它。这样，您将在程序逻辑和布局之间实现更好的分离。
于 2012-07-15T11:47:42.763 回答