фокус ввода jquery fancybox - PullRequest
       20

фокус ввода jquery fancybox

0 голосов
/ 19 декабря 2011

Я использую cakephp 1.3 и fancybox. Мне удалось поместить форму в fancybox. Теперь я хочу сфокусировать курсор на поле ввода.Я устал от многих попыток. Мой код, приведенный ниже

<script type="text/javascript">
jQuery(document).ready( function() {
//document.getElementById('frmname.answer').focus(); 
jQuery("a#answer").fancybox({
        'transitionIn'  :   'elastic',
        'transitionOut' :   'elastic',
        'speedIn'    :  600, 
        'speedOut'   :  200, 
        'overlayShow'   :   false,
        'href'  : this.href,
});

}); /* */
</script>

Я попробовал следующие вещи

'onComplete' : function() {
               $('#fancybox-frame').contents().find('#answer').focus();
            },

и

$('#answer').focus();

в моем скрипте. Нонет хорошего результата> может ли кто-нибудь указать на то, что я делаю с моим кодом неправильно. Спасибо заранее.

Мой контент fancybox выглядит так:

<div style='display:none'>
    <div id='reply'>

        <h1>Reply For <?php echo $offer['OfferBoard']['headline'] ?></h1>


        <ul class="nrml_list" > 

                <?php echo $this->Form->create('OfferAnswer',array('id'=>'frm','name'=>'frmname'), array('action' => 'reply/'.$offer['OfferBoard']['id'],'inputDefaults'=> array('label'=>false))); ?>


                <li> 
                    <div class='ulabel' style="float:right;" >Reply Text</div>
                    <div>
                        <div class="left"><?php echo $form->textarea('answer',array('class'=>'tarea1','label'=>FALSE,'id'=>'answer')); ?></div>
                        <div class="clear"></div>
                        </div>  
                </li>

                <li> 
                    <div class='ulabel' ></div>
                    <div>
                        <div class="left"><?php 
                                $attributes=array('type'=>'checkbox','div'=>false,'value' => '1','hiddenField' => false,'label'=>FALSE);
                                echo $this->Form->input('copy_to',$attributes)." Send Copy ";  
                        ?></div>
                        <div class="clear"></div>
                        </div>  
                </li>



        </ul>
            <?php echo $this->Form->end('Reply'); ?>



    </div>

Ответы [ 2 ]

4 голосов
/ 19 декабря 2011

Попробуйте:

//without quotes in onComplete, this worked for me
onComplete: function() {
   $('#answer').focus();
},

Надеюсь, это поможет

0 голосов
/ 20 декабря 2011

Я сделал ошибку с идентификатором селектора.Я использовал один и тот же идентификатор из ссылки, которую я использовал для всплывающего окна fancybox, и для поля селектора, т.е. answer.Я переименовал идентификатор поля формы в ans ... и он работает нормально.И спасибо @Sudhir, правильный код указан ниже:

<script type="text/javascript">
jQuery(document).ready( function() {
//document.frm.elements['data[OfferAnswer][answer]'].focus(); 
jQuery("a#answer").fancybox({
        'transitionIn'  :   'elastic',
        'transitionOut' :   'elastic',
        'speedIn'    :  600, 
        'speedOut'   :  200, 
        'overlayShow'   :   false,
        'href'  : this.href,
        onComplete : function() {
                    $('#ans').focus();
                        },
});

}); /* */
</script>

Новый элемент формы:

<?php echo $form->textarea('answer',array('class'=>'tarea1','label'=>FALSE,'id'=>'ans')); ?>
...