모달 양식의 작업으로 링크의 URL을 어떻게 전달할 수 있습니까?

사용자가 자격 증명 정보를 데이터베이스에 저장해야하는 Rails 애플리케이션을 작성 중입니다. 이 데이터를 보호하기 위해 객체를 사용하여 JSON 객체로 암호화하고 ActiveSupport::MessageEncryptor있습니다.

이 데이터를 받아들이고 데이터베이스에 넣는 양식이 작동합니다.

문제가있는 곳은 사용자가 정보를 수정해야 할 때입니다. 이름과 설명이 표시된 테이블이 있습니다. 이름은 데이터에 대한 링크입니다. 링크를 클릭하면 해당 정보에 대한 암호화 암호를 묻는 팝업이 표시되도록 만들려고합니다.

양식과 함께 팝업을 표시 할 수 있었지만 해결하지 못한 것은 양식의 동작이되도록 링크의 URL을 보내는 방법입니다.

이것이 내가 지금까지 가지고있는 것이지만, 더 나은 방법이 있다면이 솔루션에 얽매이지 않았습니다.

자바 스크립트 :

function deselect(e) {
  $('.pop').slideFadeToggle(function() {
    e.removeClass('selected');
  });    
}

$(function() {
  $('.edit_credential').on('click', function() {
    if($(this).hasClass('selected')) {
      deselect($(this));               
    } else {
      $(this).addClass('selected');
      $('.pop').slideFadeToggle();
    }
    return false;
  });

  $('.close').on('click', function() {
    deselect($('.edit_credential'));
    return false;
  });
});

$.fn.slideFadeToggle = function(easing, callback) {
  return this.animate({ opacity: 'toggle', height: 'toggle' }, 'fast', easing, callback);
};

HTML :

<div class="row">
    <div class="col-md-8 col-md-offset-2">
        <table class="table">
            <thead>
                <tr>
                    <th>Type</th>
                    <th>Name</th>
                    <th>Description</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td><img src="/assets/type.png" alt="Azure" /></td>
                    <td><a class="edit_credential" href="/information/26">My Info</a></td>
                    <td>Information for me</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

<div class="messagepop pop" id="cred_password">
  <form method="post" id="new_message" action="/messages">
    <p>
        <label for="password">Encryption Password</label>
        <input type="password" size="30" name="password" id="password" />
    </p>
    <p>
        <input type="submit" value="Edit Credential" name="commit" id="message_submit"/> or <a class="close" href="/">Cancel</a>
    </p>
  </form>
</div>

나는이 게시물 에서이 코드를 얻었습니다 -jQuery를 사용하여 간단한 팝업을 생성하는 방법 .

내 필요에 따라 쉽게 수정할 수 있기를 바랐지만 지금은 실패했습니다.

TIA

업데이트 :

요청으로 나는 JSFiddle을 만들었습니다 - https://jsfiddle.net/urwoqy0m/

또한 나는 이것을 위해 CSS를 추가하지 않았다는 것을 알고 있습니다.

.messagepop {
  background-color:#FFFFFF;
  border:1px solid #999999;
  cursor:default;
  display:none;
  margin-top: 15px;
  position:absolute;
  text-align:left;
  width:394px;
  z-index:50;
  padding: 25px 25px 20px;
}

.messagepop p, .messagepop.div {
  border-bottom: 1px solid #EFEFEF;
  margin: 8px 0;
  padding-bottom: 8px;
}

따라서 /messages클릭 한 링크의 URL로 설정된 양식 동작을 변경하고 싶습니다 .