1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-08-02 07:47:32 +00:00

[msg-reply]set cursor position of reply-input;improved reply js

This commit is contained in:
llj 2012-08-17 14:54:58 +08:00
parent 43ba724391
commit 59589db5e7
4 changed files with 51 additions and 23 deletions

View File

@ -12,6 +12,6 @@
</li>
{% endfor %}
</ul>
<input type="text" name="message" class="reply-input" value=""/>
<textarea name="message" class="reply-input"></textarea>
<button class="submit">回复</button>
<p class="error hide">输入不能为空且应少于150个字符。</p>

View File

@ -8,7 +8,8 @@ $('.reply, .replyclose').hover(
);
$('.reply').click(function() {
var msg_id = $(this).attr('data'),
msg_bd = $(this).parent();
msg_bd = $(this).parent(),
reply_cnt = msg_bd.find('.reply-cnt');
$.ajax({
url: '{{ SITE_ROOT }}group/reply/' + msg_id + '/',
dataType: 'json',
@ -16,11 +17,16 @@ $('.reply').click(function() {
contentType: 'application/json; charset=utf-8',
success: function(data) {
msg_bd.children('.reply-bd').html(data['html']).attr('class', 'reply-bd');
msg_bd.find('.reply-at').click(function() {
msg_bd.find('.reply-input').val('@' + $(this).attr('data') + ' ').focus();
});
var reply_input = msg_bd.find('.reply-input'),
error = msg_bd.find('.error');
function handleReplyInput() {
reply_input.val('@' + $(this).attr('data') + ' ');
var pos = reply_input.val().length;
setSelectionRange(reply_input[0], pos, pos);
}
msg_bd.find('.reply-at').click(handleReplyInput);
msg_bd.find('.submit').click(function() {
var reply = $.trim(msg_bd.find('.reply-input').val());
var reply = $.trim(reply_input.val());
if (reply && reply.length <= 150) {
$.ajax({
type: "POST",
@ -32,17 +38,14 @@ $('.reply').click(function() {
data: "message=" + reply,
success: function(data) {
msg_bd.find('.reply-list').append(data['html']);
msg_bd.find('.reply-input').val('');
msg_bd.find('.error').attr('class', 'error hide');
var reply_cnt = parseInt(msg_bd.find('.reply-cnt').html()) + 1 || 1;
msg_bd.find('.reply-cnt').html(reply_cnt + ' ');
msg_bd.find('.reply-at').click(function() {
msg_bd.find('.reply-input').val('@' + $(this).attr('data') + ' ').focus();
});
reply_input.val('');
error.attr('class', 'error hide');
reply_cnt.html((parseInt(reply_cnt.html()) + 1 || 1) + ' ');
msg_bd.find('.reply-at').click(handleReplyInput);
}
});
} else {
msg_bd.find('.error').removeClass('hide');
error.removeClass('hide');
}
});
}
@ -56,3 +59,17 @@ $('.replyclose').click(function() {
$(this).addClass('hide');
$(this).prev().removeClass('hide'); // show 'reply'
});
function setSelectionRange(input, selectionStart, selectionEnd) {
if (input.setSelectionRange) {
input.focus();
input.setSelectionRange(selectionStart, selectionEnd);
}
else if (input.createTextRange) {
var range = input.createTextRange();
range.collapse(true);
range.moveEnd('character', selectionEnd);
range.moveStart('character', selectionStart);
range.select();
}
}

View File

@ -44,7 +44,7 @@
</li>
{% endfor %}
</ul>
<input type="text" name="message" class="reply-input" value="" />
<textarea name="message" class="reply-input"></textarea>
<button class="submit">回复</button>
<p class="error hide">输入不能为空且应少于150个字符。</p>
</div>
@ -62,12 +62,18 @@
<script type="text/javascript">
{% include 'group/msg_reply_js.html' %}
$('.reply-at').click(function() {
$(this).parent().parent().parent().next().val('@' + $(this).attr('data') + ' ').focus();
var reply_input = $(this).parent().parent().parent().next();
reply_input.val('@' + $(this).attr('data') + ' ');
var pos = reply_input.val().length;
setSelectionRange(reply_input[0], pos, pos);
});
$('.reply-bd .submit').click(function() {
var msg_bd = $(this).parent().parent(),
msg_id = msg_bd.find('.reply').attr('data'),
reply = $.trim($(this).prev().val());
reply_cnt = msg_bd.find('.reply-cnt'),
reply_input = $(this).prev(),
reply = $.trim(reply_input.val()),
error = $(this).next();
if (reply && reply.length <= 150) {
$.ajax({
type: "POST",
@ -79,17 +85,18 @@ $('.reply-bd .submit').click(function() {
data: "message=" + reply,
success: function(data) {
msg_bd.find('.reply-list').append(data['html']);
msg_bd.find('.reply-input').val('');
msg_bd.find('.error').attr('class', 'error hide');
var reply_cnt = parseInt(msg_bd.find('.reply-cnt').html()) + 1 || 1;
msg_bd.find('.reply-cnt').html(reply_cnt + ' ');
reply_input.val('');
error.attr('class', 'error hide');
reply_cnt.html(parseInt(reply_cnt.html()) + 1 + ' ');
msg_bd.find('.reply-at').click(function() {
msg_bd.find('.reply-input').val('@' + $(this).attr('data') + ' ').focus();
reply_input.val('@' + $(this).attr('data') + ' ');
var pos = reply_input.val().length;
setSelectionRange(reply_input[0], pos, pos);
});
}
});
} else {
$(this).next().removeClass('hide'); // show 'error'
error.removeClass('hide');
}
});
</script>

View File

@ -739,6 +739,10 @@ p {
}
.reply-input {
width:82%;
padding:0 1px;
height:20px;
line-height:20px;
vertical-align:bottom;
}
.reply-at {
font-size:12px;