dooo61733
2012-07-15 03:40
浏览 64
已采纳

如何在jquery ajax调用后呈现smarty

I am using openinviter to retrieve contacts from gmail which works great.However, when I use jquery with ajax call to submit a form that retrieves contacts smarty does not render. It seems that smarty only renders a page reload which I don't want to do. So, my question is how can I make smarty render after jquery ajax call?

jquery ajax call

$(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>

  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • doucheng1891 2012-07-15 11:47
    已采纳

    There is a logical error in your assumption.

    Smarty is only used when the page is actually loading (or reloaded), but not when an ajax request with jQuery (or other js frameworks) is answered. Basically the variable $contacts will only get checked when the page loads, but not because of some response events in your javascript code.

    One of the main reasons of using ajax-techniques is actually avoid reloading pages.

    Two better approaches:

    1. Use your javascript to change the content of your html containers. The jquery manual section of .ajaxComplete() has a few examples on how to do it. Just declare some empty div-containers and fill them with your desired data.
    2. You can also fetch a whole smarty-template via ajax (fetch()-method) and return it. This way you'll archieve a better separation between program logic and layout.
    已采纳该答案
    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题