我试图在这个php表单中添加一些ajax搜索功能。表单已经有效,但由于我有很多输出,我希望用户能够从那里搜索并选择一个配置文件。我尝试了jquery tablesorter,尽管它有效,但它并不是我想要的。
希望有人可以提供帮助。谢谢。这是表格。
<form action="<?php echo CRoute::getURI(); ?>" method="post" id="jomsForm" name="jomsForm" class="community-form-validate">
<div class="jsProfileType">
<ul class="unstyled">
<?php
foreach($profileTypes as $profile)
{
?>
<li class="space-12">
<label for="profile-<?php echo $profile->id;?>" class="radio">
<input id="profile-<?php echo $profile->id;?>" type="radio" value="<?php echo $profile->id;?>" name="profileType" <?php echo $default == $profile->id ? ' disabled CHECKED' :'';?> />
<strong class="bold"><?php echo $profile->name;?></strong>
</label>
<?php if( $profile->approvals ){?>
<span class="help-block"><?php echo JText::_('COM_COMMUNITY_REQUIRE_APPROVAL');?></span>
<?php } ?>
<span class="help-block">
<?php
$profile->description = JHTML::_('content.prepare',$profile->description);
echo $profile->description;?>
</span>
<?php if( $default == $profile->id ){?>
<em><?php echo JText::_('COM_COMMUNITY_ALREADY_USING_THIS_PROFILE_TYPE');?></em>
<?php } ?>
</li>
<?php
}
?>
</ul>
</div>
<?php if( (count($profileTypes) == 1 && $profileTypes[0]->id != $default) || count($profileTypes) > 1 ){?>
<div style="margin-top: 5px;">
<?php if( $showNotice ){ ?>
<span style="color: red;font-weight:700;"><?php echo JText::_('COM_COMMUNITY_NOTE');?>:</span>
<span><?php echo $message;?></span>
<?php } ?>
</div>
<table class="ccontentTable paramlist" cellspacing="1" cellpadding="0">
<tbody>
<tr>
<td class="paramlist_key" style="text-align:left">
<div id="cwin-wait" style="display:none;"></div>
<input class="btn btn-primary validateSubmit" type="submit" id="btnSubmit" value="<?php echo JText::_('COM_COMMUNITY_NEXT'); ?>" name="submit">
</td>
<td class="paramlist_value">
</td>
</tr>
</tbody>
</table>
<?php } ?>
<input type="hidden" name="id" value="0" />
<input type="hidden" name="gid" value="0" />
<input type="hidden" id="authenticate" name="authenticate" value="0" />
<input type="hidden" id="authkey" name="authkey" value="" />
</form>
答案 0 :(得分:0)
我建议你Select2。它是一个非常完善的基于jquery的库,具有易于使用的ajax和自定义渲染功能。您可以查看文档的Loading Remote Data
部分。
可以将其配置为在用户插入N个字符后从服务器获取数据。然后你只需要实现服务器端搜索操作,只需很少的代码就可以使用ajax选择器。(/ p>