스크랩 스킨을 이용하여 컨텐츠를 담을수 있는 꾸러미를 만들고있습니다.

컨텐츠들은 swf파일로서 위에 컨텐츠 제목을 클릭시 새창으로 컨텐츠가 보여지게 됩니다.

스크랩해서 클릭시 컨텐츠가 보여지는것은 잘됩니다.

여기에 이어보기 기능을 달고자 합니다.(원래 꾸러미를 만든 목적이 이어보기 기능때문입니다)

컨텐츠가 보여지는페이지와 현재 보시는 순서이동 페이지에서 <tr>의 순서이동까지는 잘 됩니다.

맨위로 맨아래로 위로 아래로 잘 되고 있습니다. 근데 이걸 db에 저장하는데서 문제가 발생했습니다.

아래 보이는 소스에는 function dn() 만 우선 해보고 있습니다.

<input type="hidden" name="change_ms[<?= $i ?>]" value="<?=$list[$i][continue_order]?>"><?=$list[$i][continue_order]?>

이와같이 input으로 change_ms[0],change_ms[1]change_ms[2] 이런식의 name로 다음페이지로 값이 전달됩니다.  continue_order는 순서(1,2,3,4,5,6...)식으로 값이 입력됩니다.

문제점은 1번씩은 잘 된다는 겁니다.(4->3으로 1번은 됩니다. 4->3->2 하면 이상하게 바뀝니다.)

먼가 조금만 더 수정하면 될듯한데.. 죽겠습니다. 자바스크립트부분에서 문제가 생기는듯 합니다.

 

원래 벅스뮤직같은 그런 사이트에서 소스를 구해서 분석하여 만들려고 했는데 자바스크립트를 워낙 못하는지라.. 고수님들 조금만 도움을 주시면 감사하겠습니다.

 

 

아래 보시는 페이지의 소스 입니다. 스크랩페이지의

----------------------------------------------------------------------------------------

<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
// 팝업 616x500 - 스크랩리스트페이지

// bag_table값을 가져와야  이미 스크랩한 글로 페이지가 이동됨
$sql = "select bag_title from $g4[continue_table] where mb_id = '$member[mb_id]' and bag_id='$bag_id' and gubun='1'";
$row = sql_fetch($sql);
$bag_title = $row[bag_title];
?>
<table style="border-collapse:collapse;" cellpadding="0" cellspacing="0" width="598" height="500" bgcolor="whitesmoke" align="center">
  <tr><td width="598" height="20"></td></tr>
  <tr><td width="598" height="40"><img src="<?=$member_skin_path?>/img/popup_title_scraplist.gif" width="598" height="40" border="0"></td></tr>
  <tr><td width="598" height="25"><img src="<?=$member_skin_path?>/img/popup_bg_top.gif" width="598" height="25" border="0"></td></tr>
  <tr>
    <td width="598" height="361" background="<?=$member_skin_path?>/img/popup_bg_middle.gif" valign="top">
<form id="change_order" name="change_order" method="post" action="<?=$member_skin_path?>/changeorderproc.php">
   <!-- 컨텐츠 시작 -->
      <table style="border-collapse:collapse;" cellpadding="0" cellspacing="0" width="540" height="361" align="center">
        <tr>
          <td width="540" valign="top">
            <table style="border-collapse:collapse;" cellpadding="0" cellspacing="0" width="100%" align="center">
              <tr>
    <td height="15" colspan="4"> 현재 꾸러미 :  <b><?=$bag_title?></b></td>
    <td  colspan="2" align="right">
<!-- 꾸러미 선택시 작동되는 스크립트 -->
<script language="javascript" type="text/javascript">
<!--
 
function bag_change(form) {
 var Url=form.options[form.selectedIndex].value;
 location.href=Url;
}
function DonRelation(strTitle, ctrlThis)
{
  window.alert("[" + strTitle + "]는 이어보기 할수 없는 컨텐츠 입니다.");
  ctrlThis.checked=false;
}

 function closeWindow()
  {
    window.opener.location.reload();
    window.close()
  }

var key = 0;
  function up()
  {
    var t, t1, at1, at, bt1, bt, ct1, ct, dt1, dt, f, seq1, seq2;
    if (key<0)
    {
      window.alert("선택해주세요."); return false;
    }
    if (key>0)
    {
      t1 = "Td" + (key);
      t = "Td" + (key-1);
   at1 = "aTd" + (key);
      at = "aTd" + (key-1);
   bt1 = "bTd" + (key);
      bt = "bTd" + (key-1);
   ct1 = "cTd" + (key);
      ct = "cTd" + (key-1);
   dt1 = "dTd" + (key);
      dt = "dTd" + (key-1);
   f = "File" + (key-1)
      seq1 = "SeqNum" + (key)
      seq2 = "SeqNum" + (key-1)   
      tmp = document.all[seq1].value;
      document.all[seq1].value = document.all[seq2].value
      document.all[seq2].value = tmp
      tmp = document.all[t].innerHTML;
      document.all[t].innerHTML = document.all[t1].innerHTML;
      document.all[t1].innerHTML = tmp;
      tmp = document.all[at].innerHTML;
      document.all[at].innerHTML = document.all[at1].innerHTML;
      document.all[at1].innerHTML = tmp;
      tmp = document.all[bt].innerHTML;
      document.all[bt].innerHTML = document.all[bt1].innerHTML;
      document.all[bt1].innerHTML = tmp;
      tmp = document.all[ct].innerHTML;
      document.all[ct].innerHTML = document.all[ct1].innerHTML;
      document.all[ct1].innerHTML = tmp;
      tmp = document.all[dt].innerHTML;
      document.all[dt].innerHTML = document.all[dt1].innerHTML;
      document.all[dt1].innerHTML = tmp;
   sel(document.all[f]);
    }
  }

  function dn()
  {
    var len = document.change_order.radio.length;
    var t, t1, at1, at, bt1, bt, ct1, ct, dt1, dt, et1, et, f, seq1, seq2;
    if(key == -1) key = 0;
    if(key == len-1) return;
    if (key>-1)
    {
      t = "Td" + (key);
      t1 = "Td" + (key+1);
   at = "aTd" + (key);
      at1 = "aTd" + (key+1);
   bt = "bTd" + (key);
      bt1 = "bTd" + (key+1);
   ct = "cTd" + (key);
      ct1 = "cTd" + (key+1);
   dt = "dTd" + (key);
      dt1 = "dTd" + (key+1);
   et1 = "change_ms["+(key)+"]";
      et2= "change_ms["+(key+1)+"]";
      f = "File" + (key+1);
      seq1 = "SeqNum" + (key)
      seq2 = "SeqNum" + (key+1)    
      tmp = document.all[seq1].value;
      document.all[seq1].value = document.all[seq2].value
      document.all[seq2].value = tmp
      tmp = document.all[t].innerHTML;
      document.all[t].innerHTML = document.all[t1].innerHTML;
      document.all[t1].innerHTML = tmp;
   tmp = document.all[at].innerHTML;
      document.all[at].innerHTML = document.all[at1].innerHTML;
      document.all[at1].innerHTML = tmp;
   tmp = document.all[bt].innerHTML;
      document.all[bt].innerHTML = document.all[bt1].innerHTML;
      document.all[bt1].innerHTML = tmp;   
   tmp = document.all[ct].innerHTML;
      document.all[ct].innerHTML = document.all[ct1].innerHTML;
      document.all[ct1].innerHTML = tmp;
   tmp = document.all[dt].innerHTML;
      document.all[dt].innerHTML = document.all[dt1].innerHTML;
      document.all[dt1].innerHTML = tmp;

   tmp = document.all[et1].value;
      document.all[et1].value = document.all[et2].value;
      document.all[et2].value= tmp;

      sel(document.all[f]);
    }
  }

  function golast()
  {
    var len = document.change_order.radio.length;
    var t, t1, at1, at, bt1, bt, ct1, ct, dt1, dt, f, seq1, seq2, change;
    if(key == -1) key = 0;
    if (key>-1)
    {
    change = 0;
    for(i=key; i<len-1; i++)
    {
      t = "Td" + (i);
      t1 = "Td" + (i+1);
   at1 = "aTd" + (i);
      at = "aTd" + (i+1);
   bt1 = "bTd" + (i);
      bt = "bTd" + (i+1);
   ct1 = "cTd" + (i);
      ct = "cTd" + (i+1);
   dt1 = "dTd" + (i);
      dt = "dTd" + (i+1);
      f = "File" + (i+1);
      seq1 = "SeqNum" + (i)
      seq2 = "SeqNum" + (i+1)
      tmp = document.all[seq1].value;
      document.all[seq1].value = document.all[seq2].value
      document.all[seq2].value = tmp

   tmp = document.all[t].innerHTML;
      document.all[t].innerHTML = document.all[t1].innerHTML;
      document.all[t1].innerHTML = tmp;

   tmp = document.all[at].innerHTML;
      document.all[at].innerHTML = document.all[at1].innerHTML;
      document.all[at1].innerHTML = tmp;

   tmp = document.all[bt].innerHTML;
      document.all[bt].innerHTML = document.all[bt1].innerHTML;
      document.all[bt1].innerHTML = tmp;

   tmp = document.all[ct].innerHTML;
      document.all[ct].innerHTML = document.all[ct1].innerHTML;
      document.all[ct1].innerHTML = tmp;

   tmp = document.all[dt].innerHTML;
      document.all[dt].innerHTML = document.all[dt1].innerHTML;
      document.all[dt1].innerHTML = tmp;
  change = 1;
      }
      if(change == 1) sel(document.all[f]);
    }
  }

  function gofirst()
  {
    var t, t1, at1, at, bt1, bt, ct1, ct, dt1, dt, f, seq1, seq2;
    if(key == -1) key = 0;
    if (key>-1)
    {
    change = 0;
    for(i=key; i>0; i--)
    {
      t = "Td" + (i);
      t1 = "Td" + (i-1);
   at1 = "aTd" + (i);
      at = "aTd" + (i-1);
   bt1 = "bTd" + (i);
      bt = "bTd" + (i-1);
   ct1 = "cTd" + (i);
      ct = "cTd" + (i-1);
   dt1 = "dTd" + (i);
      dt = "dTd" + (i-1);
      f = "File" + (i-1);
      seq1 = "SeqNum" + (i)
      seq2 = "SeqNum" + (i-1)

      tmp = document.all[seq1].value;
      document.all[seq1].value = document.all[seq2].value
      document.all[seq2].value = tmp
      tmp = document.all[t].innerHTML;
      document.all[t].innerHTML = document.all[t1].innerHTML;
      document.all[t1].innerHTML = tmp;
      tmp = document.all[at].innerHTML;
      document.all[at].innerHTML = document.all[at1].innerHTML;
      document.all[at1].innerHTML = tmp;
      tmp = document.all[bt].innerHTML;
      document.all[bt].innerHTML = document.all[bt1].innerHTML;
      document.all[bt1].innerHTML = tmp;
      tmp = document.all[ct].innerHTML;
      document.all[ct].innerHTML = document.all[ct1].innerHTML;
      document.all[ct1].innerHTML = tmp;
      tmp = document.all[dt].innerHTML;
      document.all[dt].innerHTML = document.all[dt1].innerHTML;
      document.all[dt1].innerHTML = tmp;

  change = 1;
      }   
      if(change == 1) sel(document.all[f]);
    }
  }

 function sel(o)
  {
    var strv = o.id.substring(4,o.id.length); 
    key = parseInt(strv);                        // 현재 선택한 라인의 id에서 key를 뽑아 낸다.
    var change_order = document.change_order;
    change_order.radio[key].checked=true;
    SetBackground(o);
  }

  function SetBackground(o)
  {
    var len = document.change_order.radio.length;
    var t;
    for(i=0;i<len;i++)
    {
      t = "File" + (i);
      document.all[t].style.background="#FFFFFF";
    }
    o.style.background = "skyblue";
  }
//-->
</script>
     <label>
       <select name="select" onChange="javascript:bag_change(this);">
      <option value="" selected>꾸러미선택</option>
<?
//꾸러미 리스트 불러오기(g4_continue 테이블 에서 gubun 이 0이면 컨텐츠 1이면 꾸러미)
$bag_sql = " select * from $g4[continue_table] where mb_id = '$member[mb_id]' and gubun='1' order by bag_id desc";
$bag_query = sql_query($bag_sql);
for ($i=0; $bag_row=sql_fetch_array($bag_query); $i++)
{
 $bag_list[$i]=$bag_row;
 $count=count($list);
    $strBgColor = "#FFFFFF";
 $cnt = 1;
 $outError = 0;
echo "<option value='{$g4[path]}/bbs/changeorder.php?bag_id={$bag_list[$i][bag_id]}'>{$bag_list[$i][bag_title]}</option>";
}
?>
       </select>
       </label>
     </td><td><a href="<?=$member_skin_path?>/continue_cfg.php"><img src="<?=$member_skin_path?>/img/btn_bag_cfg.gif" border="0"><a></td>
   </tr>
              <tr><td height="5" colspan="7"></td></tr>

     <tr height="25" bgcolor="whitesmoke" align="center">
    <td width="4%"></td>
                <td width="10%" class="table1_1">번호</td>
                <td width="29%" class="table1_2">게시판</td>
                <td width="11%" class="table1_2">이어보기</td>
                <td width="28%" class="table1_2">컨텐츠</td>
                <td width="13%" class="table1_2">보관일시</td>
                <td width="5%" class="table1_3">삭제</td>
              </tr>
   
     <? for ($i=0; $i<count($list); $i++) {

  $FileIdx= $list[$i][num];
  $FileTitle = $list[$i][opener_href];
        $strSubject = $list[$i][subject];
//        FileType = oRsFile.Fields("FType")
//        intSeq = oRsFile.Fields("FSeq")
//        rdoName = "rdoName" & Cnt
        $strId = "File".($cnt - 1);
        $NameId = "Td".($cnt - 1);
        $NameIda = "aTd".($cnt - 1);
        $NameIdb = "bTd".($cnt - 1);
        $NameIdc = "cTd".($cnt - 1);
        $NameIdd = "dTd".($cnt - 1);
        $change_ms[$i] = "change_ms[".($cnt - 1)."]";
        if ($cnt == 1){
          $strChecked = "checked";
  } else {
          $strChecked = "";
  }

        if ($cnt == 1){
          $strBgColor = "skyblue";
        }else{
          $strBgColor = "#FFFFFF";
  }
    ?>
    <tr id="<?=$strId?>" align="center" bgcolor="<?=$strBgColor?>" onclick="sel(this)">
     <td>
<? if($list[$i][wr_8]==0){ ?>
            <input name="radio" type="radio" <?=$strChecked?> onfocus="this.blur()" onClick="javascript:DonRelation('<?=$list[$i][subject]?>', this)">
<? $continue_check="불가능"; }else{ ?>
            <input name="radio" type="radio" <?=$strChecked?> onfocus="this.blur()">
<? $continue_check="가능"; }?>    
     </td>
                <td class="table2_1"><?=$list[$i][num]?> <?=$list[$i][ms_id]?></td>
                <td class="table2_2" align="left" id="<?=$NameIda?>"><?=$list[$i][bo_subject]?> <?=$list[$i][wr_id]?></a></td>
                <td class="table2_1"id="<?=$NameIdb?>"><?=$continue_check?></td>
                <td class="table2_2" align="center" style='word-break:break-all;'  id="<?=$NameId?>">
<!-- 디비 저장하는 순서값 -->
     <input type="hidden" name="change_ms[<?= $i ?>]" value="<?=$list[$i][continue_order]?>"><?=$list[$i][continue_order]?>
     <input type="hidden" name="bag_id" value="<?=$bag_id?>">
<!-- 브레인스텝과 구분 -->
     <?if($list[$i][bo_table]=='bebe_brain_step'){?>
      <a href='#' onclick="javascript:window.open('/bebeline/data/file/<?=$list[$i][won_bo_table]?>/print_file.php?print_file=<?= $list[$i][print_file1]?>&write_table=<?=$list[$i][won_bo_table]?>&wr_id=<?=$list[$i][wr_id]?>', '', 'left=0, top=0, fullscreen=yes,  resizable=yes');" onfocus=this.blur()>
     <?}else{?>
      <a href='#' onclick="javascript:window.open('/bebeline/data/file/<?=$list[$i][bo_table]?>/print_file.php?print_file=<?= $list[$i][print_file1]?>&write_table=<?=$list[$i][bo_table]?>&wr_id=<?=$list[$i][wr_id]?>', '', 'left=0, top=0, fullscreen=yes,  resizable=yes');" onfocus=this.blur()>
     <?}?>
    <?=$list[$i][subject]?></a></td>
                <td class="table2_2" id="<?=$NameIdc?>"><?=substr($list[$i][ms_datetime],5,5)?></td>
                <td class="table2_3" id="<?=$NameIdd?>"><a href="javascript:del('<?=$list[$i][del_href]?>');"><font color="blue"><u>삭제</u></font></a></td>
              </tr>
     <?$cnt = $cnt + 1;
    }?>
              <? if ($i == 0) echo "<tr><td colspan=6 align=center height=100>즐겨찾기 자료가 없습니다</td></tr>"; ?>
            </table>
          </td>
        </tr>
        <tr><td height="30" align="center"><?=get_paging($config[cf_write_pages], $page, $total_page, "?$qstr&page=");?></td></tr>
        <tr><td height="1" bgcolor="#E5E5E5"></td></tr>
        <tr><td height="40" align="center">
  <a href="javascript:gofirst();"><img src="<?=$member_skin_path?>/img/bt_top.gif" border="0"></a>
  <a href="javascript:golast();"><img src="<?=$member_skin_path?>/img/bt_bottom.gif" border="0"></a>
  <a href="javascript:up();"><img src="<?=$member_skin_path?>/img/bt_up.gif" border="0"></a>
  <a href="javascript:dn();"><img src="<?=$member_skin_path?>/img/bt_down.gif" border="0"></a>       
  <input type="Image" src="<?=$member_skin_path?>/img/bt_save.gif" onfocus="this.blur()">
  <a href="javascript:window.close();"><img src="<?=$member_skin_path?>/img/btn_close.gif" border="0"></a>
          <input type="hidden" name="NumFile" value="<?=$Cnt-1?>">
<? for($i=0;$i<=$cnt-2;$i++){ ?>
            <input type="hidden" name="SeqNum<?= $i ?>" value="<?= $i ?>">
<? } ?>
  </td></tr>
      </table>
      <!-- 컨텐츠 끝 -->
</form>
    </td>
  </tr>
  <tr><td width="598" height="25"><img src="<?=$member_skin_path?>/img/popup_bg_tail.gif" width="598" height="25" border="0"></td></tr>
  <tr><td width="598" height="10"></td></tr>
</table>

----------------------------------------------------------------------------------------

 

다음은 값을 받아 저장하는 소스 입니다.

----------------------------------------------------------------------------------------

<?
$g4_path = "../../.."; // common.php 의 상대 경로
include_once("$g4_path/common.php");

@extract($_POST);
//꾸러미 리스트 불러오기(g4_continue 테이블 에서 gubun 이 0이면 컨텐츠 1이면 꾸러미)
$ch_order_sql = " select * from $g4[continue_table] where mb_id = '$member[mb_id]' and gubun='0' order by continue_order desc";
$ch_order_query = mysql_query($ch_order_sql);
for ($i=0; $ch_order_row=mysql_fetch_array($ch_order_query); $i++)
{
 $ch_order_list[$i][ms_id]=$ch_order_row[ms_id];
 $ch_sql="update $g4[continue_table] set `continue_order` = '{$change_ms[$i]}' where `ms_id` = '{$ch_order_list[$i][ms_id]}'";
    mysql_query($ch_sql);
echo $change_ms[$i]."<br>";
echo $ch_sql."<br>";
}

?>

----------------------------------------------------------------------------------------