问:
Change CSS of nth class in Jquery or Javascript
I am trying to change the text color of the 5th infobox (class) in my code below. The text color changes but for all the infoboxes.

//INFOBOX5
var json_data = {"headers":["Platform","Value1","value1","valueP1","valueP2"],"rows":[["platform2","xxx",404.07000000000005,1634,6364],["platform5","xxx",404.07000000000005,1634,6364],["platform1","xxx",352.8,1634,6364],["platform3","xxx",352.8,1634,6364],
["platform3","xxx",352.8,1634,6364],["platform4","xxx",352.8,1634,6364]]};

    var platform_data = json_data.rows;
    var platform1_element = document.getElementById("platform1");
    var platform5_element = document.getElementById("platform5");
    var platform6_element = document.getElementById("platform6");
    var platform2_element = document.getElementById("platform2");
    var platform3_element = document.getElementById("platform3");
    var platform4_element = document.getElementById("platform4");

    function onlyUnique(value, index, self) {
        return self.indexOf(value) === index;
    }
    function formatNumber (num) {
        return num.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,")
    }
    var platforms = [];
    for (var i in platform_data) {
        if (platform_data[i][0] != null){
            platforms[i] = platform_data[i][0].toLowerCase();
        }
    }

    var unique_platforms = platforms.filter( onlyUnique );

    var target_width = 100/(unique_platforms.length-2);
    var width_str=target_width+"%";

    platform1_element.classList.add("hidden");
    platform5_element.classList.add("hidden");
    platform6_element.classList.add("hidden");
    platform3_element.classList.add("hidden");
    platform2_element.classList.add("hidden");
    platform4_element.classList.add("hidden");

    var total_value1 = 0;
    var total_value2 = 0;
    var total_display_value1 = 0;
    var total_video_value1 = 0;
    var total_mixed_value1 = 0;
    var total_other_value1 = 0;
    var total_display_value2 = 0;
    var total_video_value2 = 0;
    var total_mixed_value2 = 0;
    var value2_numbers = [];

    for (var i in unique_platforms) {
        var platform_name = unique_platforms[i].toLowerCase();

        var display_value1_total = 0;
        var display_value2_total = 0;
        var video_value1_total = 0;
        var video_value2_total = 0;
        var mixed_value1_total = 0;
        var mixed_value2_total = 0;
        var other_value1_total = 0;

        for (var x in platform_data){
            if (platform_data[x][0] != null){
                    if(platform_data[x][0].toLowerCase() == platform_name){
                    switch(platform_data[x][1]) {
                        case "display":
                        // Red Dot
                        display_value1_total = display_value1_total + platform_data[x][2];
                        total_value1 = total_value1 + display_value1_total;
                        break;
                        case "video":
                        video_value1_total = video_value1_total + platform_data[x][2];
                        total_value1 = total_value1 + video_value1_total;
                        break;
                        case "mixed":
                        mixed_value1_total = mixed_value1_total + platform_data[x][2];
                        total_value1 = total_value1 + mixed_value1_total;
                        break;
                        case "Other":
                        other_value1_total = other_value1_total + platform_data[x][2];
                        total_value1 = total_value1 + other_value1_total;
                        break;
                        default:
                        doNothing = "";
                    }
                }
            }else {
                value2_numbers = platform_data[x];
            }
        }

        var platform_value1 = display_value1_total + video_value1_total + mixed_value1_total + other_value1_total;
        var generic_element = document.getElementById(platform_name);

        var element_value1_name = platform_name+"_value1";
        var fl_value1 = parseFloat(platform_value1).toFixed(0);
        var curr_flag = "€"+formatNumber(fl_value1);
        document.getElementById(element_value1_name).innerHTML = curr_flag;

        total_display_value1 = total_display_value1 + display_value1_total;
        total_video_value1 = total_video_value1 + video_value1_total;
        total_mixed_value1 = total_mixed_value1 + mixed_value1_total;
    }

    var total_value1_string = "
€" + formatNumber(Number(total_value1).toFixed(0)) + "
";
    //document.getElementById("total_value1").innerHTML = total_value1_string;

  if (value2_numbers.length == 0){
      value2_numbers = platform_data[0];
  }
  var fl_value2 = 0;
  var curr_flag_bud = '';
  var element_value2_name = '';

  for (var i in json_data.headers){
      switch(json_data.headers[i]) {
            case "valueP1":
                    element_value2_name = "platform1_value2";
                    fl_value2 = parseFloat(value2_numbers[i]).toFixed(0);
                    curr_flag_bud = "€"+formatNumber(fl_value2);
                    document.getElementById(element_value2_name).innerHTML = curr_flag_bud;
                    break;
        case "valueP2":
                    element_value2_name = "platform2_value2";
                    fl_value2 = parseFloat(value2_numbers[i]).toFixed(0);
                    curr_flag_bud = "€" +formatNumber(fl_value2);
                    document.getElementById(element_value2_name).innerHTML = curr_flag_bud;
                    break;
           case "valueP1":
                    element_value2_name = "platform1_value2";
                    fl_value2 = parseFloat(value2_numbers[i]).toFixed(0);
                    curr_flag_bud = "€" +formatNumber(fl_value2);
                    document.getElementById(element_value2_name).innerHTML = curr_flag_bud;
                    break;
                    default:
         }
    }

    var statBox = Array.from(document.querySelectorAll('.infobox'));

    var element_id;

    var parentBoxlist = Array.from(document.querySelectorAll('.parentbox'));

    var channel_value1_check = 0;
    var value1_channels = [];

 //   if (total_mixed_value1 > 0.0) {channel_value1_check = channel_value1_check + 1;value1_channels[0] = 'mixed';};
 //   if (total_video_value1 > 0.0) {channel_value1_check = channel_value1_check + 1;value1_channels[1] = 'video';};
 //   if (total_display_value1 > 0.0) {channel_value1_check = channel_value1_check + 1;value1_channels[2] = 'display';};

    statBox.forEach(function(box) {
        switch(unique_platforms.length) {
            case 1:
                    // 1 box
                    element_id = box.getAttribute('id');
                    if (unique_platforms.includes(element_id)){
                        box.classList.add('infobox1');
                        box.classList.remove('hidden');
                    }
                    break;
                    case 2:
                    // 2 box's
                    element_id = box.getAttribute('id');
                    if (unique_platforms.includes(element_id)){
                        box.classList.add('infobox2');
                        box.classList.remove('hidden');
                    }
                    break;
                    case 3:
                    // 3 box's
                     element_id = box.getAttribute('id');
                    if (unique_platforms.includes(element_id)){
                        box.classList.add('infobox3');
                        box.classList.remove('hidden');
                    }
                    break;
                    case 4:
                    // 4 box's
                     element_id = box.getAttribute('id');
                    if (unique_platforms.includes(element_id)){
                        box.classList.add('infobox4');
                        box.classList.remove('hidden');
                    }
                    break;
                    case 5:
                    // 5 box's
                    element_id = box.getAttribute('id');
                    if (unique_platforms.includes(element_id)){
                        box.classList.add('infobox5');
                        box.classList.remove('hidden');
                    }
                    break;
                    default:
                }
            });

$(".boxbox:nth-of-type(1)").css("color", "#fff");```
<pre class="snippet-code-css lang-css prettyprint-override"><code>@import url('https://fonts.googleapis.com/css?family=Roboto');

    body{
    color: #fff;
    font-family: Roboto;
    margin:0;
    overflow:hidden;
    }
    h1{
    font-size: 1.2vw;
    }
    h3{
    font-size: 1.1vw!important;
    font-weight: 100;
    margin: 0;
    padding: 5px;
    }
    .redSq{
    background-color: #ff000a;
    width: 117px;
    height: 241px;
    float:left;
    }
.row {
    display: table;
    width: 99.8%;
    height: 180px;
    color: #454545;
    background-color:#dee9f3;
    //border: solid 1px #454545;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
    margin-bottom: 10px;
}
.row > .col-lg-6 {
    display: table-cell;
    vertical-align: middle;
}
.container {
  display: flex;
  flex-wrap: wrap;
}
.container > div {
  padding: 15px;
  margin: 5px;
  flex: 0 0 calc(100% - 20px);
  text-align: left;
}
td{
  padding: 2px 2px;
  text-align: center;
  margin: 6px 0;
  border: none;
}
table{
  width: 100%;
  background-color:#454545;
  font-weight:500;
  border-collapse: separate;
  border-spacing:0.3em 1.1em;
  color: #fff;
  border: 0;
}
p{
    font-size: 1.2vw;
}
    .boxes{
    padding-top: 40px;
    padding-left: 30px;
    padding-right: 5%;
    min-width: 200px;
    float:left;
    display: inline-block;
    }

    #line{
    border-bottom: solid 1px #CCC;
    margin-top: 0px;
    padding-top: 15px;
    }

    .infobox {
    float:left;
    margin: 0;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
    color: #454545;
    }

    .infobox1 {
    float:left;
    min-height:150px;
    min-width: 100%;
    margin: 0;
    }

    .infobox2 {
    float:left;
    min-height:150px;
    min-width: 49%;
    margin: 0 0.5%;
    //padding: 18px 0;
    }

    .infobox3 {
    float:left;
    min-height:150px;
    min-width: 32.33%;
    margin: 0 0.5%;
    //padding: 18px 0;
    }

    .infobox4 {
    float:left;
    //min-height:150px;
    min-width: 23.9%;
    margin: 0 0.5%;
    //padding: 18px 0;
    }

    .infobox5 {
    float:left;
    min-height:150px;
    min-width: 32.33%;
    margin: 0 0.5% 0.7%;
    //padding: 18px 0;
    }

    div.leftBox{
    float:left;
    width:60%;
    margin: 15px 0 0 25px;
    font-size: 1.1vw;
    }
    div.rightBox{
    float:left;
    width: 60%;
    margin: 15px 0 0 25px;
    font-size: 1.1vw;
    }

    .infocontentheader {
    //text-align: center;
    line-height: 2.8;
    //color: #fff;
    vertical-align: middle;
    height: 100%;
    float:left;
    width:25%;
    }

    .infocontent{
    text-align: center;
    color: #fff;
    width: 50%;
    float: left;
    }

    div#platform1.infocontentheader{
    background-color: #3c5999;
    }

    div#platform1.infobox img{
        display: block;
        margin: 0 auto 0 auto;
    }

    p#sTitle {
         font-weight: 900;
         font-size: 1.5vw;
     }

     p#bTitle {
         //font-weight: 900;
         font-size: 1.2vw;
     }

     p#platform1_value1, p#platform5_value1, p#platform4_value1 ,p#platform3_value1,
     p#platform2_value1, p#twitter_value1 {
         font-weight: 900;
         font-size: 1.3em;
         margin: 10px 0 0 20px;
     }

     p#platform1_budget, p#platform5_budget, p#platform4_budget, p#platform3_budget,
     p#platform2_budget, p#twitter_budget{
        font-size: 1.2em;
        margin: 10px 0 0 20px;
     }

    div#twitter.infocontentheader{
    background-color: #1da1f2;
    }
    div#twitter.infobox img{
        display: block;
        margin: 0 auto 0 auto;
    }

    div#platform3.infocontentheader{
    background-color: #a15aa0;
    }

    div#display.parentbox{
    background-color: #b3b3b3;
    color: #fff;
    }

    div#video.parentbox{
    background-color: #999999;
    color: #fff;
    }

    div#mixed.parentbox{
    background-color: #c1c1c1;
    color: #fff;
    }

    #platform3 div.infocontentheader{
    color: #fff;
    }
    div#platform3.infobox img{

        display: block;
        margin: 0 auto 0 auto;
    }

    div#platform3_value.infocontent{
    color: #000;
    }

    div#platform5.infocontentheader{
    background-color: #ff0102;
    }
    div#platform5.infobox img{
    display: block;
    margin: 0 auto 0 auto;
    }
    div#platform4.infocontentheader{
        background-color: #cac9c2;
    }
    div#platform4.infobox img{
        display: block;
        margin: 10% auto 0 auto;
    }
  div#platform2.infobox{
    background-color: #fff;
    }
    div#platform2.infobox img{
    display: block;
    margin: 10% auto 0 auto;
    }

    .hidden{
    display:none;
    }

    #parent_div_1{
        width:50%;
        min-height: 150px;
        background-color: #757476;
        margin-right:0px;
        float:left;
    }
    #parent_div_2{
        width:50%;
        min-height: 150px;
        background-color: #8D8D8D;
        margin-right:0px;
        float:left;
    }
    .parentbox{
        width:33.33%;
        min-height: 150px;
        /*background-color: #8D8D8D;*/
        margin-right:0px;
        float:left;
    }
    .parentbox1{
        width:100%;
        min-height: 150px;
        margin-right:0px;
        float:left;
    }
    .parentbox2{
        width:50%;
        min-height: 150px;
        margin-right:0px;
        float:left;
    }
    .parentbox3{
        width:33.33%;
        min-height: 150px;
        margin-right:0px;
        float:left;
    }
    .child_div_1{
    margin-top: 50px;
    margin-left: 15%;
    margin-bottom: 0px;
    text-align: left;
    }
    .child_div_2{
    margin-left: 15%;
    margin-top: 10px;
    margin-bottom: 40px;
    text-align: left;
    }
     .child_budget{
    margin-top: 10px;
    margin-bottom: 40px;
    padding-left:15%;
    text-align: left;
    float: left;
    }
    .child_value1{
    margin-top: 10px;
    margin-bottom: 40px;
    padding-right: 15%;
    text-align: left;
    float:right;
    }
     .child_title{
    margin-top: 50px;
    margin-bottom: 0px;
    text-align: center;
    }
    .child_budget_number{
        padding-right: 20%;
    }
    .child_value1_number{
        padding-left: 20%;
    }

.boxbox {
    display: table;
    width: 99.8%;
    height: 160px;
    color: #454545;
    font-size:1.1vw;
}

.boxbox {
    float:left;
    display: table;
    width: 99.8%;
    height: 180px;
    color: #454545;
}
.boxbox > .col-lg-6 {
    display: table-cell;
    vertical-align: middle;
}</code>```

value1

value2

value1

value2

value1

value2

value1

value2

value1

value2

value1

value2

```

答:
Your direct child of class container infobox5 is overwriting the CSS color for your Jquery method. You have to remove it first and then use it as demonstrated below:

Note- .eq(index) is better suited for your query in contrast to :nth-of-type(index). You can try them both and see it for yourself.

Pointer:

Clean up your CSS, a lot of unecessary styles have been implemented but for this query, as mentioned by the other answer as well .boxbox class is implementing its own color style and as mentioned the child of div with class infobox5 is also implementing its own color style which overrides the JQuery css being implemented on the parent container.

$(".infobox5").eq(4).css("color", "green"); //Index starts from 0 for 1st element, 1 for 2nd and so on 4 for 5th element of type .infobox5```
<pre class="snippet-code-css lang-css prettyprint-override"><code>@import url('https://fonts.googleapis.com/css?family=Roboto');
body {
  color: #fff;
  font-family: Roboto;
  margin: 0;
  overflow: hidden;
}

h1 {
  font-size: 1.2vw;
}

h3 {
  font-size: 1.1vw!important;
  font-weight: 100;
  margin: 0;
  padding: 5px;
}

.redSq {
  background-color: #ff000a;
  width: 117px;
  height: 241px;
  float: left;
}

.row {
  display: table;
  width: 99.8%;
  height: 180px;
  color: #454545;
  background-color: #dee9f3;
  //border: solid 1px #454545;
  box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
  margin-bottom: 10px;
}

.row>.col-lg-6 {
  display: table-cell;
  vertical-align: middle;
}

.container {
  display: flex;
  flex-wrap: wrap;
}

.container>div {
  padding: 15px;
  margin: 5px;
  flex: 0 0 calc(100% - 20px);
  text-align: left;
}

td {
  padding: 2px 2px;
  text-align: center;
  margin: 6px 0;
  border: none;
}

table {
  width: 100%;
  background-color: #454545;
  font-weight: 500;
  border-collapse: separate;
  border-spacing: 0.3em 1.1em;
  color: #fff;
  border: 0;
}

p {
  font-size: 1.2vw;
}

.boxes {
  padding-top: 40px;
  padding-left: 30px;
  padding-right: 5%;
  min-width: 200px;
  float: left;
  display: inline-block;
}

#line {
  border-bottom: solid 1px #CCC;
  margin-top: 0px;
  padding-top: 15px;
}

.infobox {
  float: left;
  margin: 0;
  box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
  color: #454545;
}

.infobox1 {
  float: left;
  min-height: 150px;
  min-width: 100%;
  margin: 0;
}

.infobox2 {
  float: left;
  min-height: 150px;
  min-width: 49%;
  margin: 0 0.5%;
  //padding: 18px 0;
}

.infobox3 {
  float: left;
  min-height: 150px;
  min-width: 32.33%;
  margin: 0 0.5%;
  //padding: 18px 0;
}

.infobox4 {
  float: left;
  //min-height:150px;
  min-width: 23.9%;
  margin: 0 0.5%;
  //padding: 18px 0;
}

.infobox5 {
  float: left;
  min-height: 150px;
  min-width: 32.33%;
  margin: 0 0.5% 0.7%;
  //padding: 18px 0;
}

div.leftBox {
  float: left;
  width: 60%;
  margin: 15px 0 0 25px;
  font-size: 1.1vw;
}

div.rightBox {
  float: left;
  width: 60%;
  margin: 15px 0 0 25px;
  font-size: 1.1vw;
}

.infocontentheader {
  //text-align: center;
  line-height: 2.8;
  //color: #fff;
  vertical-align: middle;
  height: 100%;
  float: left;
  width: 25%;
}

.infocontent {
  text-align: center;
  color: #fff;
  width: 50%;
  float: left;
}

div#facebook.infocontentheader {
  background-color: #3c5999;
}

div#facebook.infobox img {
  display: block;
  margin: 0 auto 0 auto;
}

p#sTitle {
  font-weight: 900;
  font-size: 1.5vw;
}

p#bTitle {
  //font-weight: 900;
  font-size: 1.2vw;
}

p#facebook_spend,
p#youtube_spend,
p#search_spend,
p#programmatic_spend,
p#instagram_spend,
p#twitter_spend {
  font-weight: 900;
  font-size: 1.3em;
  margin: 10px 0 0 20px;
}

p#facebook_budget,
p#youtube_budget,
p#search_budget,
p#programmatic_budget,
p#instagram_budget,
p#twitter_budget {
  font-size: 1.2em;
  margin: 10px 0 0 20px;
}

div#twitter.infocontentheader {
  background-color: #1da1f2;
}

div#twitter.infobox img {
  display: block;
  margin: 0 auto 0 auto;
}

div#programmatic.infocontentheader {
  background-color: #a15aa0;
}

div#display.parentbox {
  background-color: #b3b3b3;
  color: #fff;
}

div#video.parentbox {
  background-color: #999999;
  color: #fff;
}

div#mixed.parentbox {
  background-color: #c1c1c1;
  color: #fff;
}

#programmatic div.infocontentheader {
  color: #fff;
}

div#programmatic.infobox img {
  display: block;
  margin: 0 auto 0 auto;
}

div#programmatic_value.infocontent {
  color: #000;
}

div#youtube.infocontentheader {
  background-color: #ff0102;
}

div#youtube.infobox img {
  display: block;
  margin: 0 auto 0 auto;
}

div#search.infocontentheader {
  background-color: #cac9c2;
}

div#search.infobox img {
  display: block;
  margin: 10% auto 0 auto;
}

div#instagram.infobox {
  background-color: #fff;
}

div#instagram.infobox img {
  display: block;
  margin: 10% auto 0 auto;
}

.hidden {
  display: none;
}

#parent_div_1 {
  width: 50%;
  min-height: 150px;
  background-color: #757476;
  margin-right: 0px;
  float: left;
}

#parent_div_2 {
  width: 50%;
  min-height: 150px;
  background-color: #8D8D8D;
  margin-right: 0px;
  float: left;
}

.parentbox {
  width: 33.33%;
  min-height: 150px;
  /*background-color: #8D8D8D;*/
  margin-right: 0px;
  float: left;
}

.parentbox1 {
  width: 100%;
  min-height: 150px;
  margin-right: 0px;
  float: left;
}

.parentbox2 {
  width: 50%;
  min-height: 150px;
  margin-right: 0px;
  float: left;
}

.parentbox3 {
  width: 33.33%;
  min-height: 150px;
  margin-right: 0px;
  float: left;
}

.child_div_1 {
  margin-top: 50px;
  margin-left: 15%;
  margin-bottom: 0px;
  text-align: left;
}

.child_div_2 {
  margin-left: 15%;
  margin-top: 10px;
  margin-bottom: 40px;
  text-align: left;
}

.child_budget {
  margin-top: 10px;
  margin-bottom: 40px;
  padding-left: 15%;
  text-align: left;
  float: left;
}

.child_spend {
  margin-top: 10px;
  margin-bottom: 40px;
  padding-right: 15%;
  text-align: left;
  float: right;
}

.child_title {
  margin-top: 50px;
  margin-bottom: 0px;
  text-align: center;
}

.child_budget_number {
  padding-right: 20%;
}

.child_spend_number {
  padding-left: 20%;
}

.boxbox {
  display: table;
  width: 99.8%;
  height: 160px;
  font-size: 1.1vw;
}

.boxbox {
  float: left;
  display: table;
  width: 99.8%;
  height: 180px;
}

.boxbox>.col-lg-6 {
  display: table-cell;
  vertical-align: middle;
}</code>```

value1

353

value2

1,634

value1

value2

value1

706

value2

value1

404

value2

value1

353

value2

value1

404

value2

6,364

```

Body:
I am trying to change the text color of the 5th infobox (class) in my code below. The text color changes but for all the infoboxes.

//INFOBOX5
var json_data = {"headers":["Platform","Value1","value1","valueP1","valueP2"],"rows":[["platform2","xxx",404.07000000000005,1634,6364],["platform5","xxx",404.07000000000005,1634,6364],["platform1","xxx",352.8,1634,6364],["platform3","xxx",352.8,1634,6364],
["platform3","xxx",352.8,1634,6364],["platform4","xxx",352.8,1634,6364]]};

    var platform_data = json_data.rows;
    var platform1_element = document.getElementById("platform1");
    var platform5_element = document.getElementById("platform5");
    var platform6_element = document.getElementById("platform6");
    var platform2_element = document.getElementById("platform2");
    var platform3_element = document.getElementById("platform3");
    var platform4_element = document.getElementById("platform4");

    function onlyUnique(value, index, self) {
        return self.indexOf(value) === index;
    }
    function formatNumber (num) {
        return num.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,")
    }
    var platforms = [];
    for (var i in platform_data) {
        if (platform_data[i][0] != null){
            platforms[i] = platform_data[i][0].toLowerCase();
        }
    }

    var unique_platforms = platforms.filter( onlyUnique );

    var target_width = 100/(unique_platforms.length-2);
    var width_str=target_width+"%";

    platform1_element.classList.add("hidden");
    platform5_element.classList.add("hidden");
    platform6_element.classList.add("hidden");
    platform3_element.classList.add("hidden");
    platform2_element.classList.add("hidden");
    platform4_element.classList.add("hidden");

    var total_value1 = 0;
    var total_value2 = 0;
    var total_display_value1 = 0;
    var total_video_value1 = 0;
    var total_mixed_value1 = 0;
    var total_other_value1 = 0;
    var total_display_value2 = 0;
    var total_video_value2 = 0;
    var total_mixed_value2 = 0;
    var value2_numbers = [];

    for (var i in unique_platforms) {
        var platform_name = unique_platforms[i].toLowerCase();

        var display_value1_total = 0;
        var display_value2_total = 0;
        var video_value1_total = 0;
        var video_value2_total = 0;
        var mixed_value1_total = 0;
        var mixed_value2_total = 0;
        var other_value1_total = 0;

        for (var x in platform_data){
            if (platform_data[x][0] != null){
                    if(platform_data[x][0].toLowerCase() == platform_name){
                    switch(platform_data[x][1]) {
                        case "display":
                        // Red Dot
                        display_value1_total = display_value1_total + platform_data[x][2];
                        total_value1 = total_value1 + display_value1_total;
                        break;
                        case "video":
                        video_value1_total = video_value1_total + platform_data[x][2];
                        total_value1 = total_value1 + video_value1_total;
                        break;
                        case "mixed":
                        mixed_value1_total = mixed_value1_total + platform_data[x][2];
                        total_value1 = total_value1 + mixed_value1_total;
                        break;
                        case "Other":
                        other_value1_total = other_value1_total + platform_data[x][2];
                        total_value1 = total_value1 + other_value1_total;
                        break;
                        default:
                        doNothing = "";
                    }
                }
            }else {
                value2_numbers = platform_data[x];
            }
        }

        var platform_value1 = display_value1_total + video_value1_total + mixed_value1_total + other_value1_total;
        var generic_element = document.getElementById(platform_name);

        var element_value1_name = platform_name+"_value1";
        var fl_value1 = parseFloat(platform_value1).toFixed(0);
        var curr_flag = "€"+formatNumber(fl_value1);
        document.getElementById(element_value1_name).innerHTML = curr_flag;

        total_display_value1 = total_display_value1 + display_value1_total;
        total_video_value1 = total_video_value1 + video_value1_total;
        total_mixed_value1 = total_mixed_value1 + mixed_value1_total;
    }

    var total_value1_string = "
€" + formatNumber(Number(total_value1).toFixed(0)) + "
";
    //document.getElementById("total_value1").innerHTML = total_value1_string;

  if (value2_numbers.length == 0){
      value2_numbers = platform_data[0];
  }
  var fl_value2 = 0;
  var curr_flag_bud = '';
  var element_value2_name = '';

  for (var i in json_data.headers){
      switch(json_data.headers[i]) {
            case "valueP1":
                    element_value2_name = "platform1_value2";
                    fl_value2 = parseFloat(value2_numbers[i]).toFixed(0);
                    curr_flag_bud = "€"+formatNumber(fl_value2);
                    document.getElementById(element_value2_name).innerHTML = curr_flag_bud;
                    break;
        case "valueP2":
                    element_value2_name = "platform2_value2";
                    fl_value2 = parseFloat(value2_numbers[i]).toFixed(0);
                    curr_flag_bud = "€" +formatNumber(fl_value2);
                    document.getElementById(element_value2_name).innerHTML = curr_flag_bud;
                    break;
           case "valueP1":
                    element_value2_name = "platform1_value2";
                    fl_value2 = parseFloat(value2_numbers[i]).toFixed(0);
                    curr_flag_bud = "€" +formatNumber(fl_value2);
                    document.getElementById(element_value2_name).innerHTML = curr_flag_bud;
                    break;
                    default:
         }
    }

    var statBox = Array.from(document.querySelectorAll('.infobox'));

    var element_id;

    var parentBoxlist = Array.from(document.querySelectorAll('.parentbox'));

    var channel_value1_check = 0;
    var value1_channels = [];

 //   if (total_mixed_value1 > 0.0) {channel_value1_check = channel_value1_check + 1;value1_channels[0] = 'mixed';};
 //   if (total_video_value1 > 0.0) {channel_value1_check = channel_value1_check + 1;value1_channels[1] = 'video';};
 //   if (total_display_value1 > 0.0) {channel_value1_check = channel_value1_check + 1;value1_channels[2] = 'display';};

    statBox.forEach(function(box) {
        switch(unique_platforms.length) {
            case 1:
                    // 1 box
                    element_id = box.getAttribute('id');
                    if (unique_platforms.includes(element_id)){
                        box.classList.add('infobox1');
                        box.classList.remove('hidden');
                    }
                    break;
                    case 2:
                    // 2 box's
                    element_id = box.getAttribute('id');
                    if (unique_platforms.includes(element_id)){
                        box.classList.add('infobox2');
                        box.classList.remove('hidden');
                    }
                    break;
                    case 3:
                    // 3 box's
                     element_id = box.getAttribute('id');
                    if (unique_platforms.includes(element_id)){
                        box.classList.add('infobox3');
                        box.classList.remove('hidden');
                    }
                    break;
                    case 4:
                    // 4 box's
                     element_id = box.getAttribute('id');
                    if (unique_platforms.includes(element_id)){
                        box.classList.add('infobox4');
                        box.classList.remove('hidden');
                    }
                    break;
                    case 5:
                    // 5 box's
                    element_id = box.getAttribute('id');
                    if (unique_platforms.includes(element_id)){
                        box.classList.add('infobox5');
                        box.classList.remove('hidden');
                    }
                    break;
                    default:
                }
            });

$(".boxbox:nth-of-type(1)").css("color", "#fff");

@import url('https://fonts.googleapis.com/css?family=Roboto');

    body{
    color: #fff;
    font-family: Roboto;
    margin:0;
    overflow:hidden;
    }
    h1{
    font-size: 1.2vw;
    }
    h3{
    font-size: 1.1vw!important;
    font-weight: 100;
    margin: 0;
    padding: 5px;
    }
    .redSq{
    background-color: #ff000a;
    width: 117px;
    height: 241px;
    float:left;
    }
.row {
    display: table;
    width: 99.8%;
    height: 180px;
    color: #454545;
    background-color:#dee9f3;
    //border: solid 1px #454545;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
    margin-bottom: 10px;
}
.row > .col-lg-6 {
    display: table-cell;
    vertical-align: middle;
}
.container {
  display: flex;
  flex-wrap: wrap;
}
.container > div {
  padding: 15px;
  margin: 5px;
  flex: 0 0 calc(100% - 20px);
  text-align: left;
}
td{
  padding: 2px 2px;
  text-align: center;
  margin: 6px 0;
  border: none;
}
table{
  width: 100%;
  background-color:#454545;
  font-weight:500;
  border-collapse: separate;
  border-spacing:0.3em 1.1em;
  color: #fff;
  border: 0;
}
p{
    font-size: 1.2vw;
}
    .boxes{
    padding-top: 40px;
    padding-left: 30px;
    padding-right: 5%;
    min-width: 200px;
    float:left;
    display: inline-block;
    }

    #line{
    border-bottom: solid 1px #CCC;
    margin-top: 0px;
    padding-top: 15px;
    }

    .infobox {
    float:left;
    margin: 0;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
    color: #454545;
    }

    .infobox1 {
    float:left;
    min-height:150px;
    min-width: 100%;
    margin: 0;
    }

    .infobox2 {
    float:left;
    min-height:150px;
    min-width: 49%;
    margin: 0 0.5%;
    //padding: 18px 0;
    }

    .infobox3 {
    float:left;
    min-height:150px;
    min-width: 32.33%;
    margin: 0 0.5%;
    //padding: 18px 0;
    }

    .infobox4 {
    float:left;
    //min-height:150px;
    min-width: 23.9%;
    margin: 0 0.5%;
    //padding: 18px 0;
    }

    .infobox5 {
    float:left;
    min-height:150px;
    min-width: 32.33%;
    margin: 0 0.5% 0.7%;
    //padding: 18px 0;
    }

    div.leftBox{
    float:left;
    width:60%;
    margin: 15px 0 0 25px;
    font-size: 1.1vw;
    }
    div.rightBox{
    float:left;
    width: 60%;
    margin: 15px 0 0 25px;
    font-size: 1.1vw;
    }

    .infocontentheader {
    //text-align: center;
    line-height: 2.8;
    //color: #fff;
    vertical-align: middle;
    height: 100%;
    float:left;
    width:25%;
    }

    .infocontent{
    text-align: center;
    color: #fff;
    width: 50%;
    float: left;
    }

    div#platform1.infocontentheader{
    background-color: #3c5999;
    }

    div#platform1.infobox img{
        display: block;
        margin: 0 auto 0 auto;
    }

    p#sTitle {
         font-weight: 900;
         font-size: 1.5vw;
     }

     p#bTitle {
         //font-weight: 900;
         font-size: 1.2vw;
     }

     p#platform1_value1, p#platform5_value1, p#platform4_value1 ,p#platform3_value1,
     p#platform2_value1, p#twitter_value1 {
         font-weight: 900;
         font-size: 1.3em;
         margin: 10px 0 0 20px;
     }

     p#platform1_budget, p#platform5_budget, p#platform4_budget, p#platform3_budget,
     p#platform2_budget, p#twitter_budget{
        font-size: 1.2em;
        margin: 10px 0 0 20px;
     }

    div#twitter.infocontentheader{
    background-color: #1da1f2;
    }
    div#twitter.infobox img{
        display: block;
        margin: 0 auto 0 auto;
    }

    div#platform3.infocontentheader{
    background-color: #a15aa0;
    }

    div#display.parentbox{
    background-color: #b3b3b3;
    color: #fff;
    }

    div#video.parentbox{
    background-color: #999999;
    color: #fff;
    }

    div#mixed.parentbox{
    background-color: #c1c1c1;
    color: #fff;
    }

    #platform3 div.infocontentheader{
    color: #fff;
    }
    div#platform3.infobox img{

        display: block;
        margin: 0 auto 0 auto;
    }

    div#platform3_value.infocontent{
    color: #000;
    }

    div#platform5.infocontentheader{
    background-color: #ff0102;
    }
    div#platform5.infobox img{
    display: block;
    margin: 0 auto 0 auto;
    }
    div#platform4.infocontentheader{
        background-color: #cac9c2;
    }
    div#platform4.infobox img{
        display: block;
        margin: 10% auto 0 auto;
    }
  div#platform2.infobox{
    background-color: #fff;
    }
    div#platform2.infobox img{
    display: block;
    margin: 10% auto 0 auto;
    }

    .hidden{
    display:none;
    }

    #parent_div_1{
        width:50%;
        min-height: 150px;
        background-color: #757476;
        margin-right:0px;
        float:left;
    }
    #parent_div_2{
        width:50%;
        min-height: 150px;
        background-color: #8D8D8D;
        margin-right:0px;
        float:left;
    }
    .parentbox{
        width:33.33%;
        min-height: 150px;
        /*background-color: #8D8D8D;*/
        margin-right:0px;
        float:left;
    }
    .parentbox1{
        width:100%;
        min-height: 150px;
        margin-right:0px;
        float:left;
    }
    .parentbox2{
        width:50%;
        min-height: 150px;
        margin-right:0px;
        float:left;
    }
    .parentbox3{
        width:33.33%;
        min-height: 150px;
        margin-right:0px;
        float:left;
    }
    .child_div_1{
    margin-top: 50px;
    margin-left: 15%;
    margin-bottom: 0px;
    text-align: left;
    }
    .child_div_2{
    margin-left: 15%;
    margin-top: 10px;
    margin-bottom: 40px;
    text-align: left;
    }
     .child_budget{
    margin-top: 10px;
    margin-bottom: 40px;
    padding-left:15%;
    text-align: left;
    float: left;
    }
    .child_value1{
    margin-top: 10px;
    margin-bottom: 40px;
    padding-right: 15%;
    text-align: left;
    float:right;
    }
     .child_title{
    margin-top: 50px;
    margin-bottom: 0px;
    text-align: center;
    }
    .child_budget_number{
        padding-right: 20%;
    }
    .child_value1_number{
        padding-left: 20%;
    }

.boxbox {
    display: table;
    width: 99.8%;
    height: 160px;
    color: #454545;
    font-size:1.1vw;
}

.boxbox {
    float:left;
    display: table;
    width: 99.8%;
    height: 180px;
    color: #454545;
}
.boxbox > .col-lg-6 {
    display: table-cell;
    vertical-align: middle;
}

value1

value2

value1

value2

value1

value2

value1

value2

value1

value2

value1

value2

Body:
Your direct child of class container infobox5 is overwriting the CSS color for your Jquery method. You have to remove it first and then use it as demonstrated below:

Note- .eq(index) is better suited for your query in contrast to :nth-of-type(index). You can try them both and see it for yourself.

Pointer:

Clean up your CSS, a lot of unecessary styles have been implemented but for this query, as mentioned by the other answer as well .boxbox class is implementing its own color style and as mentioned the child of div with class infobox5 is also implementing its own color style which overrides the JQuery css being implemented on the parent container.

$(".infobox5").eq(4).css("color", "green"); //Index starts from 0 for 1st element, 1 for 2nd and so on 4 for 5th element of type .infobox5

@import url('https://fonts.googleapis.com/css?family=Roboto');
body {
  color: #fff;
  font-family: Roboto;
  margin: 0;
  overflow: hidden;
}

h1 {
  font-size: 1.2vw;
}

h3 {
  font-size: 1.1vw!important;
  font-weight: 100;
  margin: 0;
  padding: 5px;
}

.redSq {
  background-color: #ff000a;
  width: 117px;
  height: 241px;
  float: left;
}

.row {
  display: table;
  width: 99.8%;
  height: 180px;
  color: #454545;
  background-color: #dee9f3;
  //border: solid 1px #454545;
  box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
  margin-bottom: 10px;
}

.row>.col-lg-6 {
  display: table-cell;
  vertical-align: middle;
}

.container {
  display: flex;
  flex-wrap: wrap;
}

.container>div {
  padding: 15px;
  margin: 5px;
  flex: 0 0 calc(100% - 20px);
  text-align: left;
}

td {
  padding: 2px 2px;
  text-align: center;
  margin: 6px 0;
  border: none;
}

table {
  width: 100%;
  background-color: #454545;
  font-weight: 500;
  border-collapse: separate;
  border-spacing: 0.3em 1.1em;
  color: #fff;
  border: 0;
}

p {
  font-size: 1.2vw;
}

.boxes {
  padding-top: 40px;
  padding-left: 30px;
  padding-right: 5%;
  min-width: 200px;
  float: left;
  display: inline-block;
}

#line {
  border-bottom: solid 1px #CCC;
  margin-top: 0px;
  padding-top: 15px;
}

.infobox {
  float: left;
  margin: 0;
  box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
  color: #454545;
}

.infobox1 {
  float: left;
  min-height: 150px;
  min-width: 100%;
  margin: 0;
}

.infobox2 {
  float: left;
  min-height: 150px;
  min-width: 49%;
  margin: 0 0.5%;
  //padding: 18px 0;
}

.infobox3 {
  float: left;
  min-height: 150px;
  min-width: 32.33%;
  margin: 0 0.5%;
  //padding: 18px 0;
}

.infobox4 {
  float: left;
  //min-height:150px;
  min-width: 23.9%;
  margin: 0 0.5%;
  //padding: 18px 0;
}

.infobox5 {
  float: left;
  min-height: 150px;
  min-width: 32.33%;
  margin: 0 0.5% 0.7%;
  //padding: 18px 0;
}

div.leftBox {
  float: left;
  width: 60%;
  margin: 15px 0 0 25px;
  font-size: 1.1vw;
}

div.rightBox {
  float: left;
  width: 60%;
  margin: 15px 0 0 25px;
  font-size: 1.1vw;
}

.infocontentheader {
  //text-align: center;
  line-height: 2.8;
  //color: #fff;
  vertical-align: middle;
  height: 100%;
  float: left;
  width: 25%;
}

.infocontent {
  text-align: center;
  color: #fff;
  width: 50%;
  float: left;
}

div#facebook.infocontentheader {
  background-color: #3c5999;
}

div#facebook.infobox img {
  display: block;
  margin: 0 auto 0 auto;
}

p#sTitle {
  font-weight: 900;
  font-size: 1.5vw;
}

p#bTitle {
  //font-weight: 900;
  font-size: 1.2vw;
}

p#facebook_spend,
p#youtube_spend,
p#search_spend,
p#programmatic_spend,
p#instagram_spend,
p#twitter_spend {
  font-weight: 900;
  font-size: 1.3em;
  margin: 10px 0 0 20px;
}

p#facebook_budget,
p#youtube_budget,
p#search_budget,
p#programmatic_budget,
p#instagram_budget,
p#twitter_budget {
  font-size: 1.2em;
  margin: 10px 0 0 20px;
}

div#twitter.infocontentheader {
  background-color: #1da1f2;
}

div#twitter.infobox img {
  display: block;
  margin: 0 auto 0 auto;
}

div#programmatic.infocontentheader {
  background-color: #a15aa0;
}

div#display.parentbox {
  background-color: #b3b3b3;
  color: #fff;
}

div#video.parentbox {
  background-color: #999999;
  color: #fff;
}

div#mixed.parentbox {
  background-color: #c1c1c1;
  color: #fff;
}

#programmatic div.infocontentheader {
  color: #fff;
}

div#programmatic.infobox img {
  display: block;
  margin: 0 auto 0 auto;
}

div#programmatic_value.infocontent {
  color: #000;
}

div#youtube.infocontentheader {
  background-color: #ff0102;
}

div#youtube.infobox img {
  display: block;
  margin: 0 auto 0 auto;
}

div#search.infocontentheader {
  background-color: #cac9c2;
}

div#search.infobox img {
  display: block;
  margin: 10% auto 0 auto;
}

div#instagram.infobox {
  background-color: #fff;
}

div#instagram.infobox img {
  display: block;
  margin: 10% auto 0 auto;
}

.hidden {
  display: none;
}

#parent_div_1 {
  width: 50%;
  min-height: 150px;
  background-color: #757476;
  margin-right: 0px;
  float: left;
}

#parent_div_2 {
  width: 50%;
  min-height: 150px;
  background-color: #8D8D8D;
  margin-right: 0px;
  float: left;
}

.parentbox {
  width: 33.33%;
  min-height: 150px;
  /*background-color: #8D8D8D;*/
  margin-right: 0px;
  float: left;
}

.parentbox1 {
  width: 100%;
  min-height: 150px;
  margin-right: 0px;
  float: left;
}

.parentbox2 {
  width: 50%;
  min-height: 150px;
  margin-right: 0px;
  float: left;
}

.parentbox3 {
  width: 33.33%;
  min-height: 150px;
  margin-right: 0px;
  float: left;
}

.child_div_1 {
  margin-top: 50px;
  margin-left: 15%;
  margin-bottom: 0px;
  text-align: left;
}

.child_div_2 {
  margin-left: 15%;
  margin-top: 10px;
  margin-bottom: 40px;
  text-align: left;
}

.child_budget {
  margin-top: 10px;
  margin-bottom: 40px;
  padding-left: 15%;
  text-align: left;
  float: left;
}

.child_spend {
  margin-top: 10px;
  margin-bottom: 40px;
  padding-right: 15%;
  text-align: left;
  float: right;
}

.child_title {
  margin-top: 50px;
  margin-bottom: 0px;
  text-align: center;
}

.child_budget_number {
  padding-right: 20%;
}

.child_spend_number {
  padding-left: 20%;
}

.boxbox {
  display: table;
  width: 99.8%;
  height: 160px;
  font-size: 1.1vw;
}

.boxbox {
  float: left;
  display: table;
  width: 99.8%;
  height: 180px;
}

.boxbox>.col-lg-6 {
  display: table-cell;
  vertical-align: middle;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<div id="wrapper2" style="height:160px;">
<div class="infobox infobox5" id="platform1">
<div class="boxbox">
  <div class="col-lg-6" style="background-color: #3c5999; min-width: 50px;">
    <img src="">
  </div>
  <div class="col-lg-6" style="float: left;">
    <div class="container">
      <div id="sTitle">value1<br>
        <div id="platform1_value1">353</div>
      </div>
      <div id="bTitle">value2<br>
        <div id="platform1_value2">1,634</div>
      </div>
    </div>
  </div>
</div>
</div>
<div class="infobox hidden" id="platform6">
<div class="boxbox" style="color: rgb(255, 255, 255);">
  <div class="col-lg-6" style="background-color: #3c5999; min-width: 50px;">
    <img src="">
  </div>
  <div class="col-lg-6" style="float: left;">
    <div class="container">
      <div id="sTitle">value1<br>
        <div id="platform6_value1"></div>
      </div>
      <div id="bTitle">value2<br>
        <div id="platform6_value2"></div>
      </div>
    </div>
  </div>
</div>
</div>
<div class="infobox infobox5" id="platform5">
<div class="boxbox" >
  <div class="col-lg-6" style="background-color: #a15aa0; min-width: 50px;">
    <img src="">
  </div>
  <div class="col-lg-6" style="float: left;">
    <div class="container">
      <div id="sTitle">value1<br>
        <div id="platform5_value1">706</div>
      </div>
      <div id="bTitle">value2<br>
        <div id="platform5_value2"></div>
      </div>
    </div>
  </div>
</div>
</div>
<div class="infobox infobox5" id="platform3">
<div class="boxbox" id="platform3" >
  <div class="col-lg-6" style="background-color: #ff0102; min-width: 50px;">
    <img src="">
  </div>
  <div class="col-lg-6" style="float: left;">
    <div class="container">
      <div id="sTitle">value1<br>
        <div id="platform3_value1">404</div>
      </div>
      <div id="bTitle">value2<br>
        <div id="platform3_value2"></div>
      </div>
    </div>
  </div>
</div>
</div>
<div class="infobox infobox5" id="platform4">
<div class="boxbox">
  <div class="col-lg-6" style="background-color: #cac9c2; min-width: 50px;">
    <img src="">
  </div>
  <div class="col-lg-6" style="float: left;">
    <div class="container">
      <div id="sTitle">value1<br>
        <div id="platform4_value1">353</div>
      </div>
      <div id="bTitle">value2<br>
        <div id="platform4_value2"></div>
      </div>
    </div>
  </div>
</div>
</div>
<div class="infobox infobox5" id="platform2">
<div class="boxbox" id="platform2" >
  <div class="col-lg-6" style="background-color: #8a3ab9; min-width: 50px;">
    <img src="">
  </div>
  <div class="col-lg-6" style="float: left;">
    <div class="container">
      <div id="sTitle">value1<br>
        <div id="platform2_value1">404</div>
      </div>
      <div id="bTitle">value2<br>
        <div id="platform2_value2">6,364</div>
      </div>
    </div>
  </div>
</div>
</div>
</div>


来源: stackexchange

问:
Parsing a string into a dictionary with two keys and a value
I have a Python program prog1 (mapper) printing out below in three fields.  It ends with

```<code> print user, text, rt
</code>```

First field is username.  Second is tweet text.  Third is # of retweets.  Trying to figure out TopN retweets

Below is an example

```<code>inocybetech RT @ONAPproject: #ONAPAmsterdam is here! This first code release delivers a unified architecture for end-to-end, closed-loop…  5
jchawki RT @ONAPproject: #ONAPAmsterdam is here! This first code release delivers a unified architecture for end-to-end, closed-loop…  6
jchawki RT @opnfv: Congrats to @ONAPproject on Amsterdam, on its 1st platform release! Learn more about its unified architecture for e…  2
jchawki RT @jzemlin: Now Available! #ONAP Amsterdam brings globally shared implementation for network automation, based on OSS & open st…  3
jchawki RT @bdwick: Now Available! #ONAP Amsterdam brings globally shared implementation for network automation, based on OSS & open st…  1
</code>```

I am piping this into another Python program prog2 (reducer) via stdin.  My problem is figuring out how to read this into a dictionary with two Keys (user and text) and the value (retweet)

If I say

```<code>for line in sys.stdin
</code>```

line is not capturing the entire string.  What I need to do is capture the three fields in a dictionary with two keys and one value.

Can you suggest something? I am just starting to learn Python

Thanks

答:
It's probably better to use a format which is easier for parsing. If you print everything just space-delimited, it might get quite complicated to separate individual fields afterwards since the text of the tweet contains spaces (and perhaps even newlines).

One option would be to generate/parse CSV (this has the additional advantage that you can use your output easily with other software supporting CSV input).

So the writer (csvw.py) could in loose terms look like:

```<code>import csv
import sys

writer = csv.writer(sys.stdout, delimiter = ' ')

writer.writerow(['Name', 'Content\nof the message', 12])
</code>```

and the reader (csvr.py):

```<code>import csv
import sys

reader = csv.reader(sys.stdin, delimiter = ' ')
stat = {}
for record in reader:
    name, message, cnt = record

    key = (name, message)
    stat[key] = int(cnt)

print(stat)
</code>```

then if you do:

```<code>python csvw.py | python csvr.py
</code>```

you get:

```<code>{('Name', 'Content\nof the message'): 12}
</code>```

ContentLicense: CC BY-SA 3.0

Body:
I have a Python program prog1 (mapper) printing out below in three fields.  It ends with

 print user, text, rt

First field is username.  Second is tweet text.  Third is # of retweets.  Trying to figure out TopN retweets

Below is an example

inocybetech RT @ONAPproject: #ONAPAmsterdam is here! This first code release delivers a unified architecture for end-to-end, closed-loop…  5
jchawki RT @ONAPproject: #ONAPAmsterdam is here! This first code release delivers a unified architecture for end-to-end, closed-loop…  6
jchawki RT @opnfv: Congrats to @ONAPproject on Amsterdam, on its 1st platform release! Learn more about its unified architecture for e…  2
jchawki RT @jzemlin: Now Available! #ONAP Amsterdam brings globally shared implementation for network automation, based on OSS & open st…  3
jchawki RT @bdwick: Now Available! #ONAP Amsterdam brings globally shared implementation for network automation, based on OSS & open st…  1

I am piping this into another Python program prog2 (reducer) via stdin.  My problem is figuring out how to read this into a dictionary with two Keys (user and text) and the value (retweet)

If I say

for line in sys.stdin

line is not capturing the entire string.  What I need to do is capture the three fields in a dictionary with two keys and one value.

Can you suggest something? I am just starting to learn Python

Thanks

Body:
It's probably better to use a format which is easier for parsing. If you print everything just space-delimited, it might get quite complicated to separate individual fields afterwards since the text of the tweet contains spaces (and perhaps even newlines).

One option would be to generate/parse CSV (this has the additional advantage that you can use your output easily with other software supporting CSV input).

So the writer (csvw.py) could in loose terms look like:

import csv
import sys

writer = csv.writer(sys.stdout, delimiter = ' ')

writer.writerow(['Name', 'Content\nof the message', 12])

and the reader (csvr.py):

import csv
import sys

reader = csv.reader(sys.stdin, delimiter = ' ')
stat = {}
for record in reader:
    name, message, cnt = record

    key = (name, message)
    stat[key] = int(cnt)

print(stat)

then if you do:

python csvw.py | python csvr.py

you get:

{('Name', 'Content\nof the message'): 12}


问:
Android Studio - External Libraries
I've two computers,say A and B. I've complete source code of my Android Application which i am building in Android Studio 1.2.1.1 in my computer A. Now, I've to work in computer B also. So, I've installed Android Studio in my computer B and copied the source code to B and loaded into the Android Studio. Everything went fine, but it's saying that Failed to resolve myexternallibraries which i've in the \MyApplication\app\build\intermediates\exploded-aar directory.but the Android Studio is not taking those directories into account.

I know that this error can be solved by re-downloading those libraries again, but i want to know if there's any OFFLINE SOLUTION to this problem.

答:
try changing the dependencies in your gradle.build . For example</p>

```<code>dependencies {
compile files('libs/opencsv-2.3.jar')
}
</code>```

Title: Android Studio - External Libraries

Body:
try changing the dependencies in your gradle.build . For example

dependencies {
compile files('libs/opencsv-2.3.jar')
}


问:
Async Controllers in ASP.NET MVC
I have a "blog" website developed using ASP.NET MVC 1. Recent version of MVC includes AsyncController feature. This actually requires some additional task in development. But how can I reuse my existing code without modifying my business layer.

Some part of the code looks like:

```<code>BlogPost post = new BlogPost();
post.GetPost(58345);

BlogComment comments = new BlogComment();
comments.GetComments(58345);
</code>```

As per the current environment, I need to wait till the request completes two operations. Using AsyncController, I can do two operations simultaneously. But the classes BlogPost and BlogComment requires to be changed to support for asynchronous operations like adding EventHandlers to know whether the operation is completed and etc.

How can I do asynchronous operation without modifying existing business layer.

答:
First, why do you think you need to do Async Controllers?  Are you experiencing some performance problem that you thinkn Async will help you with?  Why complicate your application with Async handling if you do not really need it?

Async is really designed to handle much more massive scaling, or when you need to do non-cpu bound operations in your controllers that might take a long time to execute.

Second, I think you are a bit confused about how Async controllers operate.  You don't need to modify your business layer in most cases, you simply need to create an async "shim" to wrap your business layer.  Async does not mean "multi-threaded".  it will still do one thread per request, and you will still call your business logic single threaded (unless you write code to do things multi-threaded).

All Async controllers do is allow for better utilization of the Thread Pool.  When you have threads that are not CPU bound, they can be returned to the thread pool while waiting for your request to be re-activated, thus allowing the thread pool to be better utlized, rather than using a thread doing nothing but waiting.

If you need to call multiple operations, you use the AsyncManager.OutstandingOperations property to control how many operaitons must complete to complete the request.

ContentLicense: CC BY-SA 2.5

Title: Async Controllers in ASP.NET MVC

Body:
I have a "blog" website developed using ASP.NET MVC 1. Recent version of MVC includes AsyncController feature. This actually requires some additional task in development. But how can I reuse my existing code without modifying my business layer.

Some part of the code looks like:

BlogPost post = new BlogPost();
post.GetPost(58345);

BlogComment comments = new BlogComment();
comments.GetComments(58345);

As per the current environment, I need to wait till the request completes two operations. Using AsyncController, I can do two operations simultaneously. But the classes BlogPost and BlogComment requires to be changed to support for asynchronous operations like adding EventHandlers to know whether the operation is completed and etc.

How can I do asynchronous operation without modifying existing business layer.


问:
Master Slave Configuration in Laravel 5.5
How to configure Laravel 5.5 with master slave MySQL replication ?

I want to make write operations and read operations in master and slave respectively .

Optional: Is there any way to do connection pooling and max / min no of open connections in ideal conditions. ?

答:
Just change your config/database.php file to include read (slave) and write (master) hosts like so like the Laravel docs suggest:

```<code>'mysql' => [
    'read' => [
        'host' => '192.168.1.1',
    ],
    'write' => [
        'host' => '196.168.1.2'
    ],
    'sticky'    => true,
    'driver'    => 'mysql',
    'database'  => 'database',
    'username'  => 'root',
    'password'  => '',
    'charset' => 'utf8mb4',
    'collation' => 'utf8mb4_unicode_ci',
    'prefix'    => '',
],
</code>```

Body:
Just change your config/database.php file to include read (slave) and write (master) hosts like so like the Laravel docs suggest:

'mysql' => [
    'read' => [
        'host' => '192.168.1.1',
    ],
    'write' => [
        'host' => '196.168.1.2'
    ],
    'sticky'    => true,
    'driver'    => 'mysql',
    'database'  => 'database',
    'username'  => 'root',
    'password'  => '',
    'charset' => 'utf8mb4',
    'collation' => 'utf8mb4_unicode_ci',
    'prefix'    => '',
],


问:
How to add an entry to an external JSON array?
I'm working on a discord bot and I was searching how to add an entry to a JSON array, but I couldn't find an answer.

I want

```<code>{"blacklisted": ["test1", "test2"]}
</code>```

to become

```<code>{"blacklisted": ["test1", "test2", "test3"]}
</code>```

This is what I tried

const file = require('./numbers.json');
var fs = require('fs');
var blacklisted = file.blacklisted
blacklisted.push('test3');
var logger = fs.createWriteStream('numbers.json')
    logger.write(`{"blacklisted":[${blacklisted}]}`)```
</div>
</div>
</p>

<p>but it gives me this:</p>

```{"blacklisted":[test1,test2,test3]}
```

答:
Do it like this,</p>

```<code>const file = require('./numbers.json');
var fs = require('fs');
var blacklisted = file.blacklisted
blacklisted.push('test3');
var logger = fs.createWriteStream('numbers.json')
    logger.write(JSON.stringify(file))
</code>```

Body:
I'm working on a discord bot and I was searching how to add an entry to a JSON array, but I couldn't find an answer.

I want

{"blacklisted": ["test1", "test2"]}

to become

{"blacklisted": ["test1", "test2", "test3"]}

This is what I tried

const file = require('./numbers.json');
var fs = require('fs');
var blacklisted = file.blacklisted
blacklisted.push('test3');
var logger = fs.createWriteStream('numbers.json')
    logger.write(`{"blacklisted":[${blacklisted}]}`)

but it gives me this:

{"blacklisted":[test1,test2,test3]}

Body:
Do it like this,

const file = require('./numbers.json');
var fs = require('fs');
var blacklisted = file.blacklisted
blacklisted.push('test3');
var logger = fs.createWriteStream('numbers.json')
    logger.write(JSON.stringify(file))


问:
Change text by click and remembering answer for further compare
Got the app which guessed the person by comparing answer on the question. The app has question and button (y/n).
  How I can save answer for further compare and change question to the next? Want to do this on the only activity. App's screenshot below.
Interface

  Button will constantly be on this position, changes only question and after change, answers must save in different bool-variables.

答:
You need to have a ArrayList which contains all the question and will be displayed index by index. Such as:

```<code> int questionNo = 0; //Should be class variable
 ArrayList<String> questionList = new ArrayList<>();
  btnNext.setOnCLick(.....
     onCLick(){
         String question = questionList.get(questionNo);
         questionNo++;
     }
</code>```

and on saving of all answer, you can use ArrayList as well, Like::

```<code>   ArrayList<String> answers= new ArrayList<>();
   btnNext.setOnCLick(.....
     onCLick(){
         String question = questionList.get(questionNo);
         questionNo++;
         answers.add("Your answer");
     }
</code>```

by above code , you will have access to all answer in "answers" according to position of question in questionList.

Thanks and let me know if some thing need more to know.

EDITED:

Here is your activity::

```<code> public class ThirdActivity extends AppCompatActivity {

ArrayList<String> questions = new ArrayList<>();
ArrayList<String> answers = new ArrayList<>();

String optionSelected="";

int questionNo=0;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_third);

    questions.add("Question A");
    questions.add("Question B");
    questions.add("Question C");
    questions.add("Question D");
    questions.add("Question E");
    questions.add("Question F");
    questions.add("Question G");
    questions.add("Question H");
    questions.add("Question I");
    questions.add("Question J");
    questions.add("Question K");

    final TextView questionText = (TextView)findViewById(R.id.question);
    questionText.setText(questions.get(questionNo++));

    final RadioGroup radioGroup = (RadioGroup)findViewById(R.id.radioGroup);
    radioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
        @Override
        public void onCheckedChanged(RadioGroup group, int checkedId) {
            switch (checkedId)
            {
                case R.id.yesButton:
                    optionSelected="yes";
                    break;
                case R.id.noButton:
                    optionSelected="no";
                    break;
            }
        }
    });

    final Button nextButton = (Button)findViewById(R.id.next);
    nextButton.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {

            if(questionNo==questions.size()-1)
            {
                nextButton.setText("Print All");
                questionText.setText(questions.get(questionNo++));
                answers.add(optionSelected);
                optionSelected="";
                radioGroup.clearCheck();
            }
            if(questionNo<questions.size()){
                questionText.setText(questions.get(questionNo++));
                answers.add(optionSelected);
                optionSelected="";
                radioGroup.clearCheck();
            }
            else{
                Log.d("Print All",answers+" ");
            }
        }
    });

}
 }
</code>```

and here is xml file::

```<code> <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="100dp"
    android:id="@+id/question"
    android:gravity="center_horizontal"/>

  <RadioGroup
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:id="@+id/radioGroup"
   android:layout_gravity="center_horizontal">
   <RadioButton
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:id="@+id/yesButton"
       android:text="Yes"/>
   <RadioButton
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:id="@+id/noButton"
       android:text="No"/>
 </RadioGroup>

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:text="next"
    android:id="@+id/next"/>

</LinearLayout>
</code>```

Thanks and now let me know if need to know more.

Body:
You need to have a ArrayList which contains all the question and will be displayed index by index. Such as:

 int questionNo = 0; //Should be class variable
 ArrayList<String> questionList = new ArrayList<>();
  btnNext.setOnCLick(.....
     onCLick(){
         String question = questionList.get(questionNo);
         questionNo++;
     }

and on saving of all answer, you can use ArrayList as well, Like::

   ArrayList<String> answers= new ArrayList<>();
   btnNext.setOnCLick(.....
     onCLick(){
         String question = questionList.get(questionNo);
         questionNo++;
         answers.add("Your answer");
     }

by above code , you will have access to all answer in "answers" according to position of question in questionList.

Thanks and let me know if some thing need more to know.

EDITED:

Here is your activity::

 public class ThirdActivity extends AppCompatActivity {

ArrayList<String> questions = new ArrayList<>();
ArrayList<String> answers = new ArrayList<>();

String optionSelected="";

int questionNo=0;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_third);

    questions.add("Question A");
    questions.add("Question B");
    questions.add("Question C");
    questions.add("Question D");
    questions.add("Question E");
    questions.add("Question F");
    questions.add("Question G");
    questions.add("Question H");
    questions.add("Question I");
    questions.add("Question J");
    questions.add("Question K");

    final TextView questionText = (TextView)findViewById(R.id.question);
    questionText.setText(questions.get(questionNo++));

    final RadioGroup radioGroup = (RadioGroup)findViewById(R.id.radioGroup);
    radioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
        @Override
        public void onCheckedChanged(RadioGroup group, int checkedId) {
            switch (checkedId)
            {
                case R.id.yesButton:
                    optionSelected="yes";
                    break;
                case R.id.noButton:
                    optionSelected="no";
                    break;
            }
        }
    });

    final Button nextButton = (Button)findViewById(R.id.next);
    nextButton.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {

            if(questionNo==questions.size()-1)
            {
                nextButton.setText("Print All");
                questionText.setText(questions.get(questionNo++));
                answers.add(optionSelected);
                optionSelected="";
                radioGroup.clearCheck();
            }
            if(questionNo<questions.size()){
                questionText.setText(questions.get(questionNo++));
                answers.add(optionSelected);
                optionSelected="";
                radioGroup.clearCheck();
            }
            else{
                Log.d("Print All",answers+" ");
            }
        }
    });

}
 }

and here is xml file::

 <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="100dp"
    android:id="@+id/question"
    android:gravity="center_horizontal"/>

  <RadioGroup
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:id="@+id/radioGroup"
   android:layout_gravity="center_horizontal">
   <RadioButton
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:id="@+id/yesButton"
       android:text="Yes"/>
   <RadioButton
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:id="@+id/noButton"
       android:text="No"/>
 </RadioGroup>

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:text="next"
    android:id="@+id/next"/>

</LinearLayout>

Thanks and now let me know if need to know more.


问:
Using geofire like geofences
I want to make an app which send a notification when the user enters in an area. I know that exists Geofire, and I would like to use, because i'm using a Firebase database, however I never used it, and I don't know if it has the same behaviour of Google Geofences.

Can someone tell me if I can implement my idea with Geofire?

Thank you very much for your answers!

答:
As seen in the oficial Firebase blog in this post, GeoFire Goes Mobile

What is GeoFire?

If you're new to GeoFire, it's a geolocation library that maps string keys to locations and stores them in Firebase. Using GeoFire, you can answer a simple but important question: Which keys lie within a given geographic region? But GeoFire's features don't stop at simple location queries, it's true power is that everything happens in realtime. When objects move, events will be fired as they enter, exit and move around the region.

GeoFire opens a wide range of possibilities: You can build an app that displays who's going for a run within a mile radius of yourself and show their location in realtime. You can display taxis within a search radius and animate them as they move. Or you can build an app that simply lists all interesting bars nearby.

Aswering your question, yes it's possbile to implement your idea with Geofire and even more than that.

Title: Using geofire like geofences


问:
How to handle null values in geolocation (point) object in mongodb?
I am currently working with a mongodb containing a collection of companies with the following structure:

```<code>{
    "_id": "52cdef7c4bab8bd675297d8e",
    "name": "Facebook",
    "offices": [{
        "description": "Headquarters",
        "address1": "1601 Willow Road",
        "address2": "",
        "zip_code": "94025",
        "city": "Menlo Park",
        "state_code": "CA",
        "country_code": "USA",
        "latitude": 37.41605,
        "longitude": -122.151801,
        "location": {
            "type": "Point",
            "coordinates": [-122.151801, 37.41605]
        }
    }, {
        "description": "Europe HQ",
        "address1": "",
        "address2": "",
        "zip_code": "",
        "city": "Dublin",
        "state_code": null,
        "country_code": "IRL",
        "latitude": 53.344104,
        "longitude": -6.267494,
        "location": {
            "type": "Point",
            "coordinates": [-6.267494, 53.344104]
        }
    }, {
        "description": "New York",
        "address1": "340 Madison Ave",
        "address2": "",
        "zip_code": "10017",
        "city": "New York",
        "state_code": "NY",
        "country_code": "USA",
        "latitude": null,
        "longitude": null,
        "location": {
            "type": "Point",
            "coordinates": [null, null]
        }
    }]
}
</code>```

I would like to create a geospatial index on the location field:

```<code>db.startups.createIndex( { "offices.location" : "2dsphere" } )
</code>```

However, some of the offices longitude and latitude are null values so that index creation fails with Point must only contain numeric elements.

My question is how I should and/or could handle this problem.

答:
Just drop the entire location for the offending element:</p>

```<code>"location": {
    "type": "Point",
    "coordinates": [null, null]
}
</code>```

Body:
I am currently working with a mongodb containing a collection of companies with the following structure:

{
    "_id": "52cdef7c4bab8bd675297d8e",
    "name": "Facebook",
    "offices": [{
        "description": "Headquarters",
        "address1": "1601 Willow Road",
        "address2": "",
        "zip_code": "94025",
        "city": "Menlo Park",
        "state_code": "CA",
        "country_code": "USA",
        "latitude": 37.41605,
        "longitude": -122.151801,
        "location": {
            "type": "Point",
            "coordinates": [-122.151801, 37.41605]
        }
    }, {
        "description": "Europe HQ",
        "address1": "",
        "address2": "",
        "zip_code": "",
        "city": "Dublin",
        "state_code": null,
        "country_code": "IRL",
        "latitude": 53.344104,
        "longitude": -6.267494,
        "location": {
            "type": "Point",
            "coordinates": [-6.267494, 53.344104]
        }
    }, {
        "description": "New York",
        "address1": "340 Madison Ave",
        "address2": "",
        "zip_code": "10017",
        "city": "New York",
        "state_code": "NY",
        "country_code": "USA",
        "latitude": null,
        "longitude": null,
        "location": {
            "type": "Point",
            "coordinates": [null, null]
        }
    }]
}

I would like to create a geospatial index on the location field:

db.startups.createIndex( { "offices.location" : "2dsphere" } )

However, some of the offices longitude and latitude are null values so that index creation fails with Point must only contain numeric elements.

My question is how I should and/or could handle this problem.

Body:
Just drop the entire location for the offending element:

"location": {
    "type": "Point",
    "coordinates": [null, null]
}


问:
win32com passing parameter as reference
I'm struggeling to get win32com.client working with Solidworks 2014.

Here is my minimum example:

```<code>import win32com.client
model_path = 'MW_011_500.SLDDRW'
ret_val1 = 0
ret_val2 = 0
sw_app = win32com.client.Dispatch('SLDWORKS.Application')
sw_app.OpenDoc6(model_path, 1, 1, "", ret_val1, ret_val2)
</code>```

I'm trying to automatize Solidwork with the help of python. I managed to get the comclient running and the server is answering the command to open a document. BUT I get this error:

```<code>Traceback (most recent call last):
  File "test.py", line 6, in <module>
     sw_app.OpenDoc6(model_path, 1, 1, "", ret_val1, ret_val2)
  File "<COMObject SLDWORKS.Application>", line 2, in OpenDoc6
pywintypes.com_error: (-2147352571, 'Typkonflikt.', None, 5)**
</code>```

The API function I'm using is documented here:
http://help.solidworks.com/2012/english/api/sldworksapi/solidworks.interop.sldworks~solidworks.interop.sldworks.isldworks~opendoc6.html

They error I receive, tell's me it's the wrong type of parameter I'm using. On the fith place of the call.

But is there a way to use win32com with reference parameter? If so, how? Or can't it work? I couldn't find any solutions yet.

答:
Old question, but maybe you're still interested- use OpenDoc to pass the path and the file type (http://help.solidworks.com/2018/english/api/sldworksapi/solidworks.interop.sldworks~solidworks.interop.sldworks.isldworks~opendoc.html) or OpenDoc7 (for SW 2018 and later) and pass in only what you need with an open doc specification.

Otherwise you'd need to pass in variables by reference, which in my research Python doesn't allow.

Title: win32com passing parameter as reference

Body:
I'm struggeling to get win32com.client working with Solidworks 2014.

Here is my minimum example:

import win32com.client
model_path = 'MW_011_500.SLDDRW'
ret_val1 = 0
ret_val2 = 0
sw_app = win32com.client.Dispatch('SLDWORKS.Application')
sw_app.OpenDoc6(model_path, 1, 1, "", ret_val1, ret_val2)

I'm trying to automatize Solidwork with the help of python. I managed to get the comclient running and the server is answering the command to open a document. BUT I get this error:

Traceback (most recent call last):
  File "test.py", line 6, in <module>
     sw_app.OpenDoc6(model_path, 1, 1, "", ret_val1, ret_val2)
  File "<COMObject SLDWORKS.Application>", line 2, in OpenDoc6
pywintypes.com_error: (-2147352571, 'Typkonflikt.', None, 5)**

The API function I'm using is documented here:
http://help.solidworks.com/2012/english/api/sldworksapi/solidworks.interop.sldworks~solidworks.interop.sldworks.isldworks~opendoc6.html

They error I receive, tell's me it's the wrong type of parameter I'm using. On the fith place of the call.

But is there a way to use win32com with reference parameter? If so, how? Or can't it work? I couldn't find any solutions yet.


问:
Best practice for having a nav at the top of all the pages in a site?
What is the best practice for having my nav at the the top of all mt web pages. E.g, home and about both have the nav. Do I have to repeat the code or is there a better practice?</p>

答:
This may depend on the languages you're writing your website in, but one way to do this would be to put all of the code for the nav bar in a separate file and then include that file on every page that you'd like the nav bar to appear on.

If you're using PHP, for example, you could put all of the nav bar code (even if it doesn't include PHP code and is just HTML or CSS) into a navbar.php file and then use the PHP include statement to reference the code that's in the navbar.php file, like this:

```<code>include 'navbar.php';
</code>```

By doing this, it would also make it easier to update the nav bar, as you would only need to update the code in one file, with the updates displaying on every page that includes the original navbar.php file.

One thing to note is that you'll need to use PHP on your webpages, and if you're developing locally, you'll need to have a server running PHP installed on your computer in order to actually see this. If you're looking for a PHP development environment, XAMPP or MAMP are some good options.

Body:
This may depend on the languages you're writing your website in, but one way to do this would be to put all of the code for the nav bar in a separate file and then include that file on every page that you'd like the nav bar to appear on.

If you're using PHP, for example, you could put all of the nav bar code (even if it doesn't include PHP code and is just HTML or CSS) into a navbar.php file and then use the PHP include statement to reference the code that's in the navbar.php file, like this:

include 'navbar.php';

By doing this, it would also make it easier to update the nav bar, as you would only need to update the code in one file, with the updates displaying on every page that includes the original navbar.php file.

One thing to note is that you'll need to use PHP on your webpages, and if you're developing locally, you'll need to have a server running PHP installed on your computer in order to actually see this. If you're looking for a PHP development environment, XAMPP or MAMP are some good options.


问:
nginx subpath to redirect to wordpress docker container

Background

I am working on adding a Dockerized blog stack (Wordpress + MariaDB) to our existing website that runs on Nginx. location / already serves out the website, and I have been instructed to add logic to the Nginx config where /blog redirects all traffic to the Docker container.

Attempt 1

I started the wordpress container at localhost:9999 on the server.

Using the references I added additional logic:

        location ^~ /blog {
            proxy_pass http://localhost:9999;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Host $http_host;
            proxy_set_header X-Forwarded-Proto $scheme;
        }

Problem:

Wordpress redirected http://server/blog to http://wp-admin/install.php, and since there was no rule for this I got a 404.

Attempt 2

I changed the location to process /blog as well as any URL containing wp-.*. The assumption is that all Wordpress pages will have that URL.

        location ~ ^/(blog|wp-.*) {

This worked through the Wordpress setup.
And if I explicitly visit http://server/wp-admin I am able to go to the blog admin pages.

Problem:

The Wordpress blog pages do not satisfy the regexes above, and return a 404. e.g. http://server/?p=31 is a link to a blog post.

Attempt 3

Just for the heck of it I redirected location / to the Docker container and the blog works perfectly. But that is not the problem statement I have, sadly.

Question

What do I do next, in order to serve all wordpress-specific requests from? I feel I am getting into a loop of fighting regexes when there might be a more elegant solution here.

References

nginx proxy pass subpaths not redirected

How can I have same rule for two locations in NGINX config?

nginx redirect to docker container

答:
According to a self-answered SO question https://stackoverflow.com/a/41479776/1264360</p>

```<code>// add these lines to wp-config.php
define('WP_SITE_URL', 'http://example.com/blog');
define('WP_HOME', 'http://example.com/blog');

$_SERVER['REQUEST_URI'] = '/blog' . $_SERVER['REQUEST_URI'];
</code>```

Body:
According to a self-answered SO question https://stackoverflow.com/a/41479776/1264360

// add these lines to wp-config.php
define('WP_SITE_URL', 'http://example.com/blog');
define('WP_HOME', 'http://example.com/blog');

$_SERVER['REQUEST_URI'] = '/blog' . $_SERVER['REQUEST_URI'];


问:
Assign value of a select in php variable
How do I get the selected value from a select and already print it? I have a simple form, when the user select the value I want to assign to a php variable, because I will show the selected amount and selected amount x the value of the selected ticket.
All on the same page without input

    <select id="cb_catinsumo" class="form-control   select_ticket" name="teste">
      <option value="0">0</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
      <option value="6">6</option>
      <option value="7">7</option>
      <option value="8">8</option>
      <option value="9">9</option>
      <option value="10">10</option>
    </select>

```

答:
Try following code :

```<code>if(isset($_POST['submit'])) {
    // your php code...
    $x = $_POST['teste'];
}
</code>```

your html code...

Body:
Try following code :

if(isset($_POST['submit'])) {
    // your php code...
    $x = $_POST['teste'];
}

your html code...


问:
reactstrap navbar header seems to be missing
I'm currently trying to create a navbar using reactstrap and I would like to use a

```

which would map to a Navbar.Header in React-Bootstrap.

Unfortunately I cannot find such component in reactstrap. Am I missing something?

答:
```<code>import React from 'react';
import {
  Collapse,
  Navbar,
  NavbarToggler,
  NavbarBrand,
  Nav,
  NavItem,
  NavLink,
  UncontrolledDropdown,
  DropdownToggle,
  DropdownMenu,
  DropdownItem } from 'reactstrap';

export default class Example extends React.Component {
  constructor(props) {
    super(props);

    this.toggle = this.toggle.bind(this);
    this.state = {
      isOpen: false
    };
  }
  toggle() {
    this.setState({
      isOpen: !this.state.isOpen
    });
  }
  render() {
    return (
      <div>
        <Navbar color="faded" light expand="md">
          <NavbarBrand href="/">reactstrap</NavbarBrand>
          <NavbarToggler onClick={this.toggle} />
          <Collapse isOpen={this.state.isOpen} navbar>
            <Nav className="ml-auto" navbar>
              <NavItem>
                <NavLink href="/components/">Components</NavLink>
              </NavItem>
              <NavItem>
                <NavLink href="https://github.com/reactstrap/reactstrap">Github</NavLink>
              </NavItem>
              <UncontrolledDropdown nav inNavbar>
                <DropdownToggle nav caret>
                  Options
                </DropdownToggle>
                <DropdownMenu >
                  <DropdownItem>
                    Option 1
                  </DropdownItem>
                  <DropdownItem>
                    Option 2
                  </DropdownItem>
                  <DropdownItem divider />
                  <DropdownItem>
                    Reset
                  </DropdownItem>
                </DropdownMenu>
              </UncontrolledDropdown>
            </Nav>
          </Collapse>
        </Navbar>
      </div>
    );
  }
}
<!--Navbar Properties-->
Navbar.propTypes = {
  light: PropTypes.bool,
  dark: PropTypes.bool,
  fixed: PropTypes.string,
  color: PropTypes.string,
  role: PropTypes.string,
  expand: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
  tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string])
  // pass in custom element to use
}
<!--NavbarBrand Properties-->
NavbarBrand.propTypes = {
  tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string])
  // pass in custom element to use
}
<!--NavbarToggler-->
import React from 'react';
import { Collapse, Navbar, NavbarToggler, NavbarBrand, Nav, NavItem, NavLink } from 'reactstrap';

export default class Example extends React.Component {
  constructor(props) {
    super(props);

    this.toggleNavbar = this.toggleNavbar.bind(this);
    this.state = {
      collapsed: true
    };
  }

  toggleNavbar() {
    this.setState({
      collapsed: !this.state.collapsed
    });
  }
  render() {
    return (
      <div>
        <Navbar color="faded" light>
          <NavbarBrand href="/" className="mr-auto">reactstrap</NavbarBrand>
          <NavbarToggler onClick={this.toggleNavbar} className="mr-2" />
          <Collapse isOpen={!this.state.collapsed} navbar>
            <Nav navbar>
              <NavItem>
                <NavLink href="/components/">Components</NavLink>
              </NavItem>
              <NavItem>
                <NavLink href="https://github.com/reactstrap/reactstrap">Github</NavLink>
              </NavItem>
            </Nav>
          </Collapse>
        </Navbar>
      </div>
    );
  }
}
<!--NavbarToggler Properties-->
NavbarToggler.propTypes = {
  type: PropTypes.string,
  tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string])
  // pass in custom element to use
}
</code>```

Body:
I'm currently trying to create a navbar using reactstrap and I would like to use a

which would map to a Navbar.Header in React-Bootstrap.

Unfortunately I cannot find such component in reactstrap. Am I missing something?


答: instead of using css to design a nav bar you can use bootstrap its better language than css. It has 101 predefined templates.</p>

Title: Best practice for having a nav at the top of all the pages in a site?

Body: What is the best practice for having my nav at the the top of all mt web pages. E.g, home and about both have the nav. Do I have to repeat the code or is there a better practice?


问:
Creating a Tensorflow and Pandas Environment
I using the following command to use modules in my machine learning work.

```<code>conda create -n tensorflow python=3.5
activate tensorflow
conda install pandas matplotlib jupyter notebook scipy scikit-learn nltk
conda install -c conda-forge tensorflow keras
</code>```

When i using import command in my ipython notebook

```<code>import numpy as np
import pandas as pd
</code>```

Following error is coming

```<code>Traceback (most recent call last):

  File "C:\Users\sompatha\Anaconda2\envs\Ml\lib\site-packages\IPython\core\interactiveshell.py", line 2862, in run_code
    exec(code_obj, self.user_global_ns, self.user_ns)

  File "<ipython-input-1-eeff7c4f34af>", line 1, in <module>
    import numpy as np

  File "C:\Users\sompatha\Anaconda2\envs\Ml\lib\site-packages\numpy\__init__.py", line 126, in <module>
    from numpy.__config__ import show as show_config

  File "C:\Users\sompatha\Anaconda2\envs\Ml\lib\site-packages\numpy\__config__.py", line 5
    blas_mkl_info={'library_dirs': ['C:\Users\sompatha\Anaconda2\envs\ML\\Library\\lib'], 'define_macros': [('SCIPY_MKL_H', None), ('HAVE_CBLAS', None)], 'libraries': ['mkl_core_dll', 'mkl_intel_lp64_dll', 'mkl_intel_thread_dll'], 'include_dirs': ['C:\Users\sompatha\Anaconda2\envs\ML\\Library\\include']}
                                   ^
SyntaxError: (unicode error) 'unicodeescape' codec can't decode bytes in position 2-3: truncated \UXXXXXXXX escape
</code>```

How to resolve this one ? Please help

答:
You are using old versions of conda and python.
The error tells you exactly what is going wrong: your escaped '\U' tells the interpreter there is a 8 digit code upcoming. That is not the case, the 's' is not valid in such a context.

The best thing to do: use up-to-date versions of the software packages.

The manual fix, go to:

```<code>C:\Users\sompatha\Anaconda2\envs\Ml\Lib\site-packages\numpy\__config__.py
</code>```

And replace all single slashes in path references within this file with double slashes.
Repeat the process for any other import running into the UnicodeError. Your interpreter will tell you which file is holding you back

Body:
I using the following command to use modules in my machine learning work.

conda create -n tensorflow python=3.5
activate tensorflow
conda install pandas matplotlib jupyter notebook scipy scikit-learn nltk
conda install -c conda-forge tensorflow keras

When i using import command in my ipython notebook

import numpy as np
import pandas as pd

Following error is coming

Traceback (most recent call last):

  File "C:\Users\sompatha\Anaconda2\envs\Ml\lib\site-packages\IPython\core\interactiveshell.py", line 2862, in run_code
    exec(code_obj, self.user_global_ns, self.user_ns)

  File "<ipython-input-1-eeff7c4f34af>", line 1, in <module>
    import numpy as np

  File "C:\Users\sompatha\Anaconda2\envs\Ml\lib\site-packages\numpy\__init__.py", line 126, in <module>
    from numpy.__config__ import show as show_config

  File "C:\Users\sompatha\Anaconda2\envs\Ml\lib\site-packages\numpy\__config__.py", line 5
    blas_mkl_info={'library_dirs': ['C:\Users\sompatha\Anaconda2\envs\ML\\Library\\lib'], 'define_macros': [('SCIPY_MKL_H', None), ('HAVE_CBLAS', None)], 'libraries': ['mkl_core_dll', 'mkl_intel_lp64_dll', 'mkl_intel_thread_dll'], 'include_dirs': ['C:\Users\sompatha\Anaconda2\envs\ML\\Library\\include']}
                                   ^
SyntaxError: (unicode error) 'unicodeescape' codec can't decode bytes in position 2-3: truncated \UXXXXXXXX escape

How to resolve this one ? Please help

Body:
You are using old versions of conda and python.
The error tells you exactly what is going wrong: your escaped '\U' tells the interpreter there is a 8 digit code upcoming. That is not the case, the 's' is not valid in such a context.

The best thing to do: use up-to-date versions of the software packages.

The manual fix, go to:

C:\Users\sompatha\Anaconda2\envs\Ml\Lib\site-packages\numpy\__config__.py

And replace all single slashes in path references within this file with double slashes.
Repeat the process for any other import running into the UnicodeError. Your interpreter will tell you which file is holding you back


问:
It seems your ruby installation is missing psych (for YAML output). To eliminate this warning, please install libyaml and reinstall your ruby
on fresh Solidus installation, running bundle exec rails g spree:install, throws exception

$ bundle exec rails g spree:install
/Users/jason/.rvm/rubies/ruby-2.2.5/lib/ruby/2.2.0/yaml.rb:4:in `<top (required)>':
It seems your ruby installation is missing psych (for YAML output).
To eliminate this warning, please install libyaml and reinstall your ruby.

I'm not sure how I did this but somehow I messed up a default solidus installation to the point where it refuses to run bundle exec rails g spree:install, crashing with this error now matter what I do.

There are some threads on the internet about this error (see Github Homebrew core issue 11635, Github Homebrew core 11636, this stack overflow, or this stack overflow)  most pointing to building libyaml followed by reinstalling Ruby. Some say that even more extreme measures are needed to clear this up, like removing specific references to old ghosts of libyaml which may be on your system.

I tried everything in all of the threads I found to solve this, but the problem persisted and would not go away. None of the advice from any of the links above worked.

Then I simply started from scratch, with a brand new rails app, and the problem went away. So I suspect there is something I inadvertently did in the initial setups that cause this code to produce this error, rather than the library being missing from my system (as all indications suggest)

I am posting here for reference only.
cross posted:
https://github.com/solidusio/solidus/issues/2434

https://gist.github.com/jasonfb/5d4834a55411a0f45f5f8f966188e117

答:
buggy install can be examined here:
https://github.com/jasonfb/solidus_240_helloworld_BUGGY_solidio-solidis-Issue2434

I know what I did here.

I mistakenly tried to install rails new using rails 5.2.0.beta, thinking maybe the head of solidus would just work on it. (dumb assumption).

After starting by generating a Rails 5.2.0.beta app, I then switched my gemfile's rails version down to 5.1.4. Don't do this; it doesn't work.

I then proceeded to add the Solidus gems themselves, and that when I hit the non-fixable exception after bundle exec rails g spree:install

On my two subsequent attempts to do a fresh Solidus install, I correctly used

rails _5.1.4_ new solidus-hello-world

to check which version of Rails you have install in your active gemset, use rails -v

I think what happened is that I had the 5.2.0.beta active and just ran rails new solidus-hello-world and it installed a 5.2.0.beta app.