젠드 양식 카운트 다운 문자가있는 TextArea와 StringLength Validator - 다른 계산

Question

제 형식에는 zend_form_element_textarea가 있습니다. 이 요소에 대해이 같은 발리의 StringLength를 추가

$this->addElement('textarea', 'text', array('label' => 'F_MESSAGE_SMS_TEXT', 'required' => true, 'class' => 'fieldLiveLimit', 'limit' => 160)); 
$this->text->addValidator('StringLength', false, array('max' => 160)); 

와 나는 스크립트 자바 스크립트 쇼 라이브 카운트 다운 문자 사용

//Text field or text area limit - get limit by field parameter 
    $(".fieldLiveLimit").each(function() { 
     var characters = $(this).attr('limit'); 
     var remaining = calcDifference(characters, $(this).val()); 
     if ($('.limitCounter').length > 0) { 
      $(this).after($('.limitCounter').first().clone()); 
      $(this).next('.limitCounter').children('span').html(remaining); 
     } else { 
      $(this).after($("<div class='limitCounter'>" + translate('L_LIMIT_COUNTER', [remaining]) + "</div>")); 
     } 
     checkClassCounter(remaining, $(this)); 

     $(this).bind('textchange', function (event, previousText) { 
      remaining = calcDifference(characters, $(this).val()); 
      checkClassCounter(remaining, $(this)); 
      if ($(this).val().length > characters) { 
       $(this).val($(this).val().substr(0, characters)); 
      } else { 
       $(this).next('.limitCounter').children('span').html(remaining); 
      } 
     }); 

     function calcDifference(characters, value) { 
      return characters - parseInt(value.length); 
     } 

     function checkClassCounter(remaining, element) { 
      if (parseInt(element.val().length) == 0) { 
       element.next(".limitCounter").hide(); 
      } else { 
       element.next(".limitCounter").show(); 
       if (remaining <= 10) { 
        element.next(".limitCounter").addClass('red-message'); 
       } else { 
        element.next(".limitCounter").removeClass('red-message'); 
       } 
      } 
     } 
    }); 

이 한 가지를 제외하고 잘 작동합니다. 텍스트 영역 안에 새 행이 있으면 유효성 검사기는 새 행을 두 문자로 계산하고 JS 스크립트는 하나로 계산합니다. 누가 틀렸습니까? 나는 젠드 밸리데이터를 생각합니다. 그러나 그것은 정말로 이상한 것처럼 보이고 당신에게 물어 봅니다!

Answer 1

사용자 Pankrates가 이미 주석에서 지적했듯이 줄 바꿈과 관련이 있습니다.

1. jQuery를이 val() 함수에서 캐리지 리턴 문자를 제거합니다 : 를 "현재, 그것은 적어도 두 가지 차원을 가지고 있기 때문에

   는 사실,이 문제는 처음에 보이는 것보다 훨씬 더 복잡하다 textarea 요소에서 .val()을 사용하면 브라우저에서보고 한 값에서 캐리지 리턴 문자가 제거됩니다. "jQuery documentation.

2. 브라우저에 따라 줄 바꿈이 \r\n으로 계산되는 방식이 일치하지 않습니다. 관련 질문은 here 또는 here을 참조하십시오. 그러나 내 시스템 (Firefox 20.0 및 Chrome 26.0)에 설치된 모든 브라우저에서 \r\n은 두 문자로 계산되므로이를 확인할 수 없습니다. 그것은 나에게 jQuery: 11, JS: 11, PHP: 11을 제공하는 첫 번째 상자를 들어

   <?php 
   $str1 = "test\nstring"; 
   $str2 = "test\r\nstring"; 
   ?> 
       <textarea id="text1"><?php echo $str1 ?></textarea>jQuery: <span id="jquery1"></span>, JS: <span id="js1"></span>, PHP: <?php echo iconv_strlen($str1) ?> 
       <textarea id="text2"><?php echo $str2 ?></textarea>jQuery: <span id="jquery2"></span>, JS: <span id="js2"></span>, PHP: <?php echo iconv_strlen($str2) ?> 
   
   <script type="text/javascript"> 
        $(document).ready(function() { 
          $("#jquery1").text($("#text1").val().length); 
          $("#js1").text("<?php echo str_replace(array("\n", "\r"), array('\n', '\r'), $str1) ?>".length); 
          $("#jquery2").text($("#text2").val().length); 
          $("#js2").text("<?php echo str_replace(array("\n", "\r"), array('\n', '\r'), $str2) ?>".length); 
        });  
   </script> 
   

   을하지만 두 번째 상자 나는 jQuery: 11, JS: 12, PHP: 12를 얻을 :

는 시연이 작은 코드를 참조하십시오.

1. 모든 \r\n\n로를 대체하는 양식에 Zend_Filter_PregReplace를 사용

   은 내가 생각할 수있는 몇 가지 솔루션 (어느 것도 이상적입니다)이 있습니다. Pro : 계산은 jQuery의 val() 및 상대적으로 쉬운 계산과 일치합니다. 단점 : 원하지 않는 결과를 초래할 수있는 사용자의 줄 바꿈을 손상시키고 있습니다.

2. DecorateZend_Validate_StringLength 메서드에서 \r\n을 \n으로 바꿀 수 있습니다. Pro : 사용자의 줄 바꿈을 유지합니다. Con : \r\n이 하나의 문자로 계산되어 새로운 클래스를 도입해야하기 때문에 200자를 넘는 유효한 결과를 얻을 수 있습니다.
3. 모든 줄 바꿈을 \r\n으로 바꾸려면 jQuery's textarea.valHooks을 사용하십시오. Pro : Simple, Con : 줄 바꿈 문자로 \n의 사용자가 있으면 일관성없는 결과가 나타납니다.

이 답변을 통해 앱의 상황에 따라 이러한 상황을 어떻게 해결할 수 있는지에 대한 지침을 알려 주시기 바랍니다.