Pass ein Textfeld Wert von PHP Javascript

habe ich ein Feld ein Etikett für eine highchart auf Wordpress-Back-Office wie folgt zu wählen:Pass ein Textfeld Wert von PHP Javascript

public static function sm_register_chart() { 

    $charts = array(); 
    if(function_exists('wdt_get_all_charts_nonpaged')){ 
     foreach(wdt_get_all_charts_nonpaged() as $table){ 

      $charts[$table['id']] = $table['title']; 
     } 
    } 
    $captions = array(); 

    $fields = array(

     array(
      'label' => esc_html('Graphic'), 
      'description' => esc_html('Choose the graphic'), 
      'attr' => 'chart', 
      'type' => 'select', 
      'options' => $charts, 
     ), 
     array(
      'label' => esc_html('Footer label'), 
      'description' => esc_html('Choose the footer label'), 
      'attr' => 'footer_caption', 
      'type' => 'text', 
     ), 

    );

und ich möchte weitergeben, was in footer_caption getippt wird dies, dass i js nahm von dieser Geige: http://jsfiddle.net/abenrob/ur02w4j5/

Highcharts.setOptions({ 
    chart: { 
      type: 'column', 
      events: { 
       load: function() { 
        var label = this.renderer.label("This text will adjust to chart resizing " + 
         "and redraws and will be visible on exported images.") 
        .css({ 
         width: '400px', 
         fontSize: '9px' 
        }) 
        .attr({ 
         'r': 2, 
         'padding': 5 
        }) 
        .add(); 

        label.align(Highcharts.extend(label.getBBox(), { 
         align: 'center', 
         x: 0, // offset 
         verticalAlign: 'bottom', 
         y: 0 // offset 
        }), null, 'spacingBox'); 

       } 
      }, 
      marginBottom: 120 
     }, 
     legend: { 
     align: 'center', 
     verticalAlign: 'bottom', 
     y: -30 
    },

so dass anstelle des var label = this.renderer.label("This text will adjust to chart resizing") i den Wert von footer_caption erhalten.

Ich war so etwas wie diese denken:

var labelText = document.querySelectorAll('[footer_caption]').text() 
var label = this.renderer.label(labelText)

Aber es funktioniert nicht und im der Lage, nicht einmal den Wert i von footer_caption

Quelle

2017-04-26 phpqs

Hat 'document.querySelectorAll ('[footer_caption]')' etwas zurückgeben? Oder ist das ein leeres Array? Wie auch immer, es sollte eher: 'document.querySelectorAll ('[footer_caption]') [0] .innerText;' aber ich mache mir Sorgen, dass '[footer_caption]' ein falscher Selektor ist. Wenn Sie zeigen könnten, wie das erzeugte HTML-Element aussieht, würde ich mehr darüber erzählen können. –

sehe meine Bearbeitung, ich zeige die vollständigen shortcode Optionen, wo ich footer_caption setze – phpqs

Vielleicht sollte ich anders fragen: Ist 'footer_caption' auf deiner Seite generiert (also hast du ein Tag, zB:'

') oder es ist nur ein Element in PHP-Array? –

geben bekommen

Sie dies erreichen können, indem Sie Folgendes tun ; Sie müssen möglicherweise die Kennung für footer_caption abhängig von Ihrem eigenen Code ändern;

<script type="text/javascript"> 

var footer_caption = <?= json_encode($arr['footer_caption']); ?>; 

</script>

Und dann verweisen Sie die Variable, wo es in der Javascript-Code benötigt wird.

Mit json_encode wird sichergestellt, dass ungültige Zeichen usw. korrekt behandelt werden. Der obige Code verwendet PHP-Quick-Tags. Weitere Referenzen finden Sie unter here.

Quelle

2017-04-26 11:40:33

Ok ich bin verwirrt. Hatte ich var footer_caption in der js-Datei und dann tun: var label = this.renderer.label (footer_caption)? – phpqs

ja, setzen Sie diese 'var footer_caption = ; 'in Ihrer JavaScript-Datei zusammen mit dem anderen Code und dann können Sie diese Variable verwenden, indem Sie auf die Javascript-Variable' footer_caption' verweisen. Sie müssen nur '$ arr ['footer_caption']' so ändern, dass es tatsächlich auf die PHP-Variable in Ihrem eigenen Code zeigt. –

Sie können json_encode, dies zu tun

<script> 
    var footer_caption = <?php echo json_encode($fields); ?>; 
</script>

Quelle

2017-04-26 13:05:03

Pass ein Textfeld Wert von PHP Javascript

Antwort

Verwandte Themen