0

私は、div要素、より具体的には、ユーザーのTwitterのフォロワーのプロフィール画像によるBootstrapのモーダルフォームを設定する次のフォームを持っています。

これはフォームです: http://d.pr/i/ZJMk

これは、作業を行うコードです。

<div class="modal-body">  

  <?php

    $follower_url = "http://api.twitter.com/1/statuses/followers/Mozammil_K.xml";

    $twFriends = curl_init();

    curl_setopt($twFriends, CURLOPT_URL, $follower_url);
    curl_setopt($twFriends, CURLOPT_RETURNTRANSFER, TRUE);
    $twiFriends = curl_exec($twFriends);
    $response = new SimpleXMLElement($twiFriends);

    foreach($response->user as $friends){ 
        $thumb = $friends->profile_image_url;
        $url = $friends->screen_name;
        $name = $friends->name;

    ?>



    <a title="<?php echo $url;?>" href="#"><img class="photo-img" src="<?php echo $thumb?>" border="2" alt="" width="40" onClick="highlight(this)" /></a>
    <?php

    } 

  ?>



</div>

写真をクリックして要素を選択するオプションをユーザーに提供したいと思います。写真をもう一度クリックして選択を解除することもできます。これは、次の JavaScript によって実現されています。

<script>

   function highlight(elem) {

    if(elem.style.border == '2px solid blue') {

        elem.style.border = '';
    }
    else{

        elem.style.border = '2px solid blue';

    }

    }

</script>

作成ボタンをクリックすると、フォームは強調表示された要素のタイトルを取得し、要素のタイトルをデータベースに送信する必要があります。要素を配列に保存し、JSON を介してデータを送信する以外に、これを行う方法が見つかりませんでした。私はJSONにあまり詳しくありません。それを行う他の(より簡単な)方法はありますか?おそらくJQuery?

よろしく。

4

1 に答える 1

0

これがあなたの問題の解決策になると思います。これらの3つの属性を<a class='a-img'>タグに追加しました

      "rel=<?echo $thumb?>" 
      "id=<?echo $name?>" 
      "title=<? echo $url;?>" //these will be the diffrent attr to be send on the database

これらの 3 つの属性は、「aa-img」をクリックして 3 つの非表示フィールドを追加する必要がある場合、非表示の入力に渡す必要があります。

      <input type="hidden" id="sname"/>
      <input type="hidden" id="fname"/>
      <input type="hidden" id="thumb"/>

     <a title="<?php echo $url;? class='a-img'>" href="#">
     <img class="photo-img" src="<?php echo  $thumb?>" border="2" alt="" width="40"   
     onClick="highlight(this)" /></a>
     $(document).ready(function(){

      $("#create").click(function(){
      //get the value of the 3 hidden fields 
      var sname =  $("#sname").val(sname);
      var fname = $("#fname").val(fname);
      var thumb = $("#thumb").val(thumb);

         $.ajax({
             type:"POST",
             url:"//your savetodb.php"
             data:{'sname':sname, 'fname':fname, 'thumb':thumb},
             success: function(data){
                        //do success message
                     }
         });

      });

      $("a.a-img").click(function(){
        var sname = $(this).attt('title');
        var fname = $(this).attr('id');
        var thumb = $(this).attr('rel');
               //these 3 attrbute will pass to a hidden input
                $("#sname").val(sname);
                $("#fname").val(fname);
                $("#thumb").val(thumb);
      });
 });

これがあなたを助けることを願っています。

于 2012-06-08T12:40:06.627 に答える