purazumakoiの[はてなブログ]

技術メモから最近はライフログも増えてきてます。

Ajaxでselectボックスの中身を変えた時、表示上 前の値が残る

今回、
年のselectを変更したらAjaxphpを見に行って、
月のリストを記事が登録されている月に変更するという処理を作った。


が、選択された月の値が(内部的には変わっているのかもしれないが)
見た目上変わっていない。



↑の12は、2010年には存在するが2011に変更したときは値が存在しないので、値が変わるはずなのに変わらない。


解決策はこれ

<script type="text/javascript">
// <![CDATA[
$(function(){
	$("#year").change(function () {
		$val = $(this).val();
		
		$.ajax({
		 type: "GET",
		 url: "ajax.php",
		 data: "year="+$val,
		 success: function(msg){
			 if(msg) {
			 	$("#month" ).html(msg).selectmenu('refresh', true);
				$("#month").val("-");
			 }
		 }
	 });
		
	});
});
// ]]>
</script>


肝心なのは

.selectmenu('refresh', true);

の部分でselectmenuをリフレッシュしているところ


via