问:
How do I show/hide elements using jQuery when there are two intersecting principles governing if they are to be visible or not?
I have a web page that contains a set of elements that are marked with metadata using HTML5's "data-" tag. Each element represents a specific course or program at a school. Here's an example of what the set of elements can look like:

```<code><div class="courseBox" data-type="course" data-location="campus">info about this particular course</div>

<div class="courseBox" data-type="program" data-location="campus">info about this particular course</div>

<div class="courseBox" data-type="course" data-location="distance">info about this particular course</div>

<div class="courseBox" data-type="program" data-location="distance">info about this particular course</div>
</code>```

As you can see each element is either a course (short single course) or a program (a full education that spans over several years). Furthermore, each element is eithar campus (on campus) or distance (distance learning).

In the interface for this page the user has four buttons that can either be on/true or off/false. The four buttons are:

Course | Program | Campus | Distance

When the page loads all four buttons are on/true since the page displays all courses and programs, both on campus and distance learning.

When the user clicks one of the buttons, I want to use jQuery to hide all the elements that no longer match the criteria; in other words: a filter.

At first this seemed like an easy task. Just write something along the lines of:

```<code>$("#courseButton").toggle(function(){
   $("courseBox[data-type='course']").hide();
},
function(){
   $("courseBox[data-type='course']").show();
});
</code>```

This works fine as long as the two different ways of categorizing the elements don't collide. But consider this case:

The user first clicks the "Course"
button, which hides all the courses
(marked "courses").

Then clicks the "Distance" button
which hides all elements marked
"distance".

The user then clicks the "Course"
button again, which will show all
element marked with "courses" including
those that are marked "distance",
despite the fact that they are
supposed to be hidden.

My question now is: how do I create a filter function using jQuery that will function properly eventhough there are two different (intersecting) ways of categorizing the elements?

Thanks in advance!

/Thomas Kahn

答:
I think it will be the best sollution to use controller which keeps business logic of showing and hiding objects. Then just use methods of this controller to toggle model state and always call the same method to update visibility of elements.
Here is possible solution:

```<code>var someController = (function(){
    var model = {
        showCourse: true,
        showProgram: true,
        showCampus:true,
        showDistance: true
    }

    var _UpdateView = function(){
        $(".courseBox[data-type='course']").filter(".courseBox[data-location='campus']").toggle(model.showCourse && model.showCampus);
        $(".courseBox[data-type='program']").filter(".courseBox[data-location='campus']").toggle(model.showProgram && model.showCampus);
        $(".courseBox[data-type='course']").filter(".courseBox[data-location='distance']").toggle(model.showCourse && model.showDistance);
        $(".courseBox[data-type='program']").filter(".courseBox[data-location='distance']").toggle(model.showProgram && model.showDistance);
    };

    var _toggleCourse = function(){
        model.showCourse = !model.showCourse;
        _UpdateView();
    };

    var _toggleProgram = function(){
        model.showProgram = !model.showProgram;
        _UpdateView();
    };

    var _toggleCampus = function(){
        model.showCampus = !model.showCampus;
        _UpdateView();
    };

    var _toggleDistance = function(){
        model.showDistance = !model.showDistance;
        _UpdateView();
    };

    return {
        toggleCourse: function(){_toggleCourse();},
        toggleProgram: function(){_toggleProgram();},
        toggleCampus: function(){_toggleCampus();},
        toggleDistance: function(){_toggleDistance();}
    }
})();
</code>```

Then on the page you can use buttons like this:

```<code><input type='button' value='Course' onclick='someController.toggleCourse();' />
<input type='button' value='Program' onclick='someController.toggleProgram();' />
<input type='button' value='Campus' onclick='someController.toggleCampus();' />
<input type='button' value='Distance' onclick='someController.toggleDistance();' />
</code>```

Body:
I have a web page that contains a set of elements that are marked with metadata using HTML5's "data-" tag. Each element represents a specific course or program at a school. Here's an example of what the set of elements can look like:

info about this particular course

info about this particular course

info about this particular course

info about this particular course

As you can see each element is either a course (short single course) or a program (a full education that spans over several years). Furthermore, each element is eithar campus (on campus) or distance (distance learning).

In the interface for this page the user has four buttons that can either be on/true or off/false. The four buttons are:

Course | Program | Campus | Distance

When the page loads all four buttons are on/true since the page displays all courses and programs, both on campus and distance learning.

When the user clicks one of the buttons, I want to use jQuery to hide all the elements that no longer match the criteria; in other words: a filter.

At first this seemed like an easy task. Just write something along the lines of:

$("#courseButton").toggle(function(){
   $("courseBox[data-type='course']").hide();
},
function(){
   $("courseBox[data-type='course']").show();
});

This works fine as long as the two different ways of categorizing the elements don't collide. But consider this case:

The user first clicks the "Course"
button, which hides all the courses
(marked "courses").

Then clicks the "Distance" button
which hides all elements marked
"distance".

The user then clicks the "Course"
button again, which will show all
element marked with "courses" including
those that are marked "distance",
despite the fact that they are
supposed to be hidden.

My question now is: how do I create a filter function using jQuery that will function properly eventhough there are two different (intersecting) ways of categorizing the elements?

Thanks in advance!

/Thomas Kahn

Body:
I think it will be the best sollution to use controller which keeps business logic of showing and hiding objects. Then just use methods of this controller to toggle model state and always call the same method to update visibility of elements.
Here is possible solution:

var someController = (function(){
    var model = {
        showCourse: true,
        showProgram: true,
        showCampus:true,
        showDistance: true
    }

    var _UpdateView = function(){
        $(".courseBox[data-type='course']").filter(".courseBox[data-location='campus']").toggle(model.showCourse && model.showCampus);
        $(".courseBox[data-type='program']").filter(".courseBox[data-location='campus']").toggle(model.showProgram && model.showCampus);
        $(".courseBox[data-type='course']").filter(".courseBox[data-location='distance']").toggle(model.showCourse && model.showDistance);
        $(".courseBox[data-type='program']").filter(".courseBox[data-location='distance']").toggle(model.showProgram && model.showDistance);
    };

    var _toggleCourse = function(){
        model.showCourse = !model.showCourse;
        _UpdateView();
    };

    var _toggleProgram = function(){
        model.showProgram = !model.showProgram;
        _UpdateView();
    };

    var _toggleCampus = function(){
        model.showCampus = !model.showCampus;
        _UpdateView();
    };

    var _toggleDistance = function(){
        model.showDistance = !model.showDistance;
        _UpdateView();
    };

    return {
        toggleCourse: function(){_toggleCourse();},
        toggleProgram: function(){_toggleProgram();},
        toggleCampus: function(){_toggleCampus();},
        toggleDistance: function(){_toggleDistance();}
    }
})();

Then on the page you can use buttons like this:

<input type='button' value='Course' onclick='someController.toggleCourse();' />
<input type='button' value='Program' onclick='someController.toggleProgram();' />
<input type='button' value='Campus' onclick='someController.toggleCampus();' />
<input type='button' value='Distance' onclick='someController.toggleDistance();' />


来源: stackexchange

问:
Changing the Value of an Input Box with JS
I am trying to change the value of an input box to 3.  What I have done so far is create the variable for an input box.  This variable is named "input".  Currently, the value of the input box is "20".  When I type "input" into console, here is what is returned:

```<code><input value = "20">
</code>```

Then I try to change the value of the input box by doing this:

```<code>input.value = 3;
</code>```

Then when I type "input" into console, it tells me that the value is still 20.

```<code><input value = "20">
</code>```

So my question is, how can I make it return the value of 3 to me?

答:
Based on the discussion about dispatching the event.

const inputEl = document.querySelector('input')
const btn = document.querySelector('button')
const event = new Event('change')

btn.addEventListener('click', () => {
  inputEl.setAttribute('value', Math.random())
  inputEl.dispatchEvent(event)
})

inputEl.addEventListener('change', () => console.log(inputEl))```
<pre class="snippet-code-html lang-html prettyprint-override"><code><input value="20">
<button>Add</button></code>```

ContentLicense: CC BY-SA 3.0

Body:
I am trying to change the value of an input box to 3.  What I have done so far is create the variable for an input box.  This variable is named "input".  Currently, the value of the input box is "20".  When I type "input" into console, here is what is returned:

<input value = "20">

Then I try to change the value of the input box by doing this:

input.value = 3;

Then when I type "input" into console, it tells me that the value is still 20.

<input value = "20">

So my question is, how can I make it return the value of 3 to me?

Body:
Based on the discussion about dispatching the event.

const inputEl = document.querySelector('input')
const btn = document.querySelector('button')
const event = new Event('change')

btn.addEventListener('click', () => {
  inputEl.setAttribute('value', Math.random())
  inputEl.dispatchEvent(event)
})

inputEl.addEventListener('change', () => console.log(inputEl))

<input value="20">
<button>Add</button>


问:
How to get recyceview height after settings adapter?
I need to get my recycle view height , I wrote this code but it doesn't work :

```<code>recyecle.getHeight()
</code>```

and also this one

```<code>getLayoutParams().height
</code>```

but both of them returns invalid height .

how can I get the exact height of recyceview?

答:
```<code>private int getViewHeight(View view) {
    int widthMeasureSpec = View.MeasureSpec.makeMeasureSpec(screenWidth, View.MeasureSpec.AT_MOST);
    int heightMeasureSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED);
    view.measure(widthMeasureSpec, heightMeasureSpec);
    return view.getMeasuredHeight();
  }
</code>```

call this after the recyceview has layout

by add the layout listener or if you use this after onresume that will be ok too.

at least work for me.

Body:
I need to get my recycle view height , I wrote this code but it doesn't work :

recyecle.getHeight()

and also this one

getLayoutParams().height

but both of them returns invalid height .

how can I get the exact height of recyceview?

Body:
private int getViewHeight(View view) {
    int widthMeasureSpec = View.MeasureSpec.makeMeasureSpec(screenWidth, View.MeasureSpec.AT_MOST);
    int heightMeasureSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED);
    view.measure(widthMeasureSpec, heightMeasureSpec);
    return view.getMeasuredHeight();
  }

call this after the recyceview has layout

by add the layout listener or if you use this after onresume that will be ok too.

at least work for me.


问:
GitLab Ci with docker runner - Multiple Stages
im setting up my first GitLab Ci Pipeline including docker to run my project. I wanted to divide my pipeline into several stages so i created "build", "test", and "clean-build".

In this scenario everything works fine:

```<code>stages:
  - build
  - test
  - clean

image: docker:latest

services:
  - docker:dind

before_script:
  - export RELEASE=${CI_BUILD_REF_NAME}
  - docker version

build:
  stage: build
  tags:
    - sendis-dind
  script:
  - echo "Hallo in Build Stage"

test:
  stage: test
  tags:
    - sendis-dind
  script:
    - echo "Hallo in TEST Stage"

clean-build:
  stage: clean
  tags:
    - sendis-dind
  script:
    - echo "Hallo beim Clean Up"
  when: always
</code>```

All 3 stages are run successfully

but this fails:

```<code>stages:
  - build
  - test
  - clean

image: docker:latest

services:
  - docker:dind

before_script:
  - export RELEASE=${CI_BUILD_REF_NAME}
  - docker version

build:
  stage: build
  tags:
    - sendis-dind
  script:
  - apk add --update py-pip
  - pip install docker-compose
  - docker --version
  - docker-compose --version
  - docker-compose -p ${RELEASE} build
  - docker-compose -p ${RELEASE} up -d

test:
  stage: test
  tags:
    - sendis-dind
  script:
    - docker exec ${RELEASE}_phpfpm_1 bash -c "cd /app; composer install; make runTests"

clean-build:
  stage: clean
  tags:
    - sendis-dind
  script:
    - docker-compose -p ${RELEASE} down --volumes
  when: always
</code>```

with the following message from second stage

```<code>Running with gitlab-ci-multi-runner 9.1.1 (6104325)
  on sendis-dind-runner (8b9eca1e)
Using Docker executor with image docker:latest ...
Starting service docker:dind ...
Pulling docker image docker:dind ...
Using docker image docker:dind ID=sha256:559dd16b4e0a64d9de2447d3de234743046443f770bf5226f45f9b7f9c68887b for docker service...
ERROR: Preparation failed: Cannot connect to the Docker daemon at unix:///var/run/docker.sock. Is the docker daemon running?
Will be retried in 3s ...
Using Docker executor with image docker:latest ...
Starting service docker:dind ...
Pulling docker image docker:dind ...
Using docker image docker:dind ID=sha256:559dd16b4e0a64d9de2447d3de234743046443f770bf5226f45f9b7f9c68887b for docker service...
ERROR: Preparation failed: Error response from daemon: Conflict. The container name "/runner-8b9eca1e-project-140-concurrent-0-docker" is already in use by container "db166f7894856c245c6a4f5318326c5f3b6ab82d82157961d18b079444153113". You have to remove (or rename) that container to be able to reuse that name.
Will be retried in 3s ...
Using Docker executor with image docker:latest ...
Starting service docker:dind ...
Pulling docker image docker:dind ...
Using docker image docker:dind ID=sha256:559dd16b4e0a64d9de2447d3de234743046443f770bf5226f45f9b7f9c68887b for docker service...
ERROR: Preparation failed: Error response from daemon: Conflict. The container name "/runner-8b9eca1e-project-140-concurrent-0-docker" is already in use by container "db166f7894856c245c6a4f5318326c5f3b6ab82d82157961d18b079444153113". You have to remove (or rename) that container to be able to reuse that name.
Will be retried in 3s ...
ERROR: Job failed (system failure): Error response from daemon: Conflict. The container name "/runner-8b9eca1e-project-140-concurrent-0-docker" is already in use by container "db166f7894856c245c6a4f5318326c5f3b6ab82d82157961d18b079444153113". You have to remove (or rename) that container to be able to reuse that name.
</code>```

答:
Different stages only share artifacts with each other, but they're separate docker containers. That means that if you run docker-compose up -d in your build stage, the containers are not running in the test stage.

Combining dind with gitlab-ci is only necessary in very specific use-cases. In your case, you don't need dind at all. You can simply use the php-fpm image in your test step, since gitlab-ci is already running on docker.

```<code>test:
  stage: test
  image: <your php-fpm image here>
  script:
    - cd /app
    - composer install
    - make runTests
</code>```

Body:
im setting up my first GitLab Ci Pipeline including docker to run my project. I wanted to divide my pipeline into several stages so i created "build", "test", and "clean-build".

In this scenario everything works fine:

stages:
  - build
  - test
  - clean

image: docker:latest

services:
  - docker:dind

before_script:
  - export RELEASE=${CI_BUILD_REF_NAME}
  - docker version

build:
  stage: build
  tags:
    - sendis-dind
  script:
  - echo "Hallo in Build Stage"

test:
  stage: test
  tags:
    - sendis-dind
  script:
    - echo "Hallo in TEST Stage"

clean-build:
  stage: clean
  tags:
    - sendis-dind
  script:
    - echo "Hallo beim Clean Up"
  when: always

All 3 stages are run successfully

but this fails:

stages:
  - build
  - test
  - clean

image: docker:latest

services:
  - docker:dind

before_script:
  - export RELEASE=${CI_BUILD_REF_NAME}
  - docker version

build:
  stage: build
  tags:
    - sendis-dind
  script:
  - apk add --update py-pip
  - pip install docker-compose
  - docker --version
  - docker-compose --version
  - docker-compose -p ${RELEASE} build
  - docker-compose -p ${RELEASE} up -d

test:
  stage: test
  tags:
    - sendis-dind
  script:
    - docker exec ${RELEASE}_phpfpm_1 bash -c "cd /app; composer install; make runTests"

clean-build:
  stage: clean
  tags:
    - sendis-dind
  script:
    - docker-compose -p ${RELEASE} down --volumes
  when: always

with the following message from second stage

Running with gitlab-ci-multi-runner 9.1.1 (6104325)
  on sendis-dind-runner (8b9eca1e)
Using Docker executor with image docker:latest ...
Starting service docker:dind ...
Pulling docker image docker:dind ...
Using docker image docker:dind ID=sha256:559dd16b4e0a64d9de2447d3de234743046443f770bf5226f45f9b7f9c68887b for docker service...
ERROR: Preparation failed: Cannot connect to the Docker daemon at unix:///var/run/docker.sock. Is the docker daemon running?
Will be retried in 3s ...
Using Docker executor with image docker:latest ...
Starting service docker:dind ...
Pulling docker image docker:dind ...
Using docker image docker:dind ID=sha256:559dd16b4e0a64d9de2447d3de234743046443f770bf5226f45f9b7f9c68887b for docker service...
ERROR: Preparation failed: Error response from daemon: Conflict. The container name "/runner-8b9eca1e-project-140-concurrent-0-docker" is already in use by container "db166f7894856c245c6a4f5318326c5f3b6ab82d82157961d18b079444153113". You have to remove (or rename) that container to be able to reuse that name.
Will be retried in 3s ...
Using Docker executor with image docker:latest ...
Starting service docker:dind ...
Pulling docker image docker:dind ...
Using docker image docker:dind ID=sha256:559dd16b4e0a64d9de2447d3de234743046443f770bf5226f45f9b7f9c68887b for docker service...
ERROR: Preparation failed: Error response from daemon: Conflict. The container name "/runner-8b9eca1e-project-140-concurrent-0-docker" is already in use by container "db166f7894856c245c6a4f5318326c5f3b6ab82d82157961d18b079444153113". You have to remove (or rename) that container to be able to reuse that name.
Will be retried in 3s ...
ERROR: Job failed (system failure): Error response from daemon: Conflict. The container name "/runner-8b9eca1e-project-140-concurrent-0-docker" is already in use by container "db166f7894856c245c6a4f5318326c5f3b6ab82d82157961d18b079444153113". You have to remove (or rename) that container to be able to reuse that name.

Body:
Different stages only share artifacts with each other, but they're separate docker containers. That means that if you run docker-compose up -d in your build stage, the containers are not running in the test stage.

Combining dind with gitlab-ci is only necessary in very specific use-cases. In your case, you don't need dind at all. You can simply use the php-fpm image in your test step, since gitlab-ci is already running on docker.

test:
  stage: test
  image: <your php-fpm image here>
  script:
    - cd /app
    - composer install
    - make runTests


问:
Missing last record in crystal report
I am using below code for suppressing pageheader

```<code> Whileprintingrecords;
    Global BooleanVar finished;
    finished := OnLastRecord
</code>```

In crystal report last record is missing every time because of that code, please give me any solution for this guys

答:
The formula in your question returns a boolean and therefore suppresses the last record.
But to achieve what you want, there's no need for a global variable at all.

To suppress the page header on the last page you can use following formula:

```<code>PageNumber = TotalPageCount
</code>```

Depending on the data, the report may only have one page. So if you want to keep the header if the report has only one page then you can use following formula:

```<code>TotalPageCount > 1 And PageNumber = TotalPageCount
</code>```

Title: Missing last record in crystal report

Body:
I am using below code for suppressing pageheader

 Whileprintingrecords;
    Global BooleanVar finished;
    finished := OnLastRecord

In crystal report last record is missing every time because of that code, please give me any solution for this guys

Body:
The formula in your question returns a boolean and therefore suppresses the last record.
But to achieve what you want, there's no need for a global variable at all.

To suppress the page header on the last page you can use following formula:

PageNumber = TotalPageCount

Depending on the data, the report may only have one page. So if you want to keep the header if the report has only one page then you can use following formula:

TotalPageCount > 1 And PageNumber = TotalPageCount


问:
Change Visibility of Grid on Button Click in Xaml
I am trying to find some way to when a button (Menu) is clicked, it changes the visibility of a Grid (Submenu) with a Trigger in XAML. I made it in vb.net but I wonder if it's easier to do in XAML?

Private Sub ShowSubmenu(SubmenuSettings e As Grid)
        Dim bk As Integer = VisualTreeHelper.GetChildrenCount(MainGrid)
        For i = 0 To bk - 1
            Dim g As Object = VisualTreeHelper.GetChild(MainGrid, i)
            If TypeOf g Is Grid Then g.Visibility = Visibility.Hidden
        Next
        SubmenuSettings.Visibility = Visibility.Visible
    End Sub

Private Sub Visibility(sender As Object)
        If sender Is btn1 Then
            ShowSubmenu(pdm1)
        End If
End Sub
```

答:
You can use ToggleButton instead of Button,
the idea is to switch Grid Visibility based on IsChecked Property of a ToggleButton.

```<code><Grid  Height="100" Width="100" Background="Green">
   <Grid.Style>
      <Style TargetType="Grid">
          <Setter Property="Visibility" Value="Collapsed"/>
          <Style.Triggers>
             <DataTrigger Binding="{Binding IsChecked,ElementName=btnFirst}" Value="True">
                 <Setter Property="Visibility" Value="Visible"/>
              </DataTrigger>
          </Style.Triggers>
       </Style>
   </Grid.Style>
</Grid>

 <ToggleButton x:Name="btnFirst" Content="BtnFirst" Height="100" Width="100" />
</code>```

Body:
You can use ToggleButton instead of Button,
the idea is to switch Grid Visibility based on IsChecked Property of a ToggleButton.

<Grid  Height="100" Width="100" Background="Green">
   <Grid.Style>
      <Style TargetType="Grid">
          <Setter Property="Visibility" Value="Collapsed"/>
          <Style.Triggers>
             <DataTrigger Binding="{Binding IsChecked,ElementName=btnFirst}" Value="True">
                 <Setter Property="Visibility" Value="Visible"/>
              </DataTrigger>
          </Style.Triggers>
       </Style>
   </Grid.Style>
</Grid>

 <ToggleButton x:Name="btnFirst" Content="BtnFirst" Height="100" Width="100" />


问:
How to translate this Silverlight control into HTML/CSS/JS
I am in the process of converting a Silverlight app into a standard Web app (ie all HTML, CSS and JavaScript via jQuery 1.4.4). I'm not the most experienced when it comes to web development, so I am wondering what would be the best way to convert this custom Silverlight control into a web equivalent?

It boils down to just being a fancy radio button group. The user can click on any type, and only one type can be selected at a time. For the web equivalent, it needs to set a value that will get POSTed to the server.

For now I am just using a standard <select> tag which is of course functional and doesn't require JavaScript (which is nice), but ultimately is not going to fly. I will place a <select> inside of a  tag to allow non-js people to still be functional.

Can anyone recommend a good approach for tackling this? Any existing plugins/controls out in the wild I could take advantage of?

(I am using ASP.NET MVC 3, but I don't think that's very relevant here)

答: Think of them as an array of buttons. When one is clicked, all others are unselected. Draw a rectangle around the one that was clicked and set a hidden form field equal to the value you expect when the form is submitted.</p>

ContentLicense: CC BY-SA 2.5


问:
Arraylist - Separate a string and put it into an array
I want to separate a string and put it into an array.

Example:

```<code>id = 12,32,544,877,136,987

arraylist: [0]-->12
           [1]-->32
           [2]--544
           [3]-->877
           [4]-->136
           [5]-->987
</code>```

How to do that?

答:
Can do something like this in java :</p>

```<code>   ArrayList<String> idList = new ArrayList <String>();

   String id = "12,32,544,877,136,987";

   String idArr[] = id.split(",");
   for(String idVal: idArr){
       idList.add(idVal);
   }
</code>```

Body:
I want to separate a string and put it into an array.

Example:

id = 12,32,544,877,136,987

arraylist: [0]-->12
           [1]-->32
           [2]--544
           [3]-->877
           [4]-->136
           [5]-->987

How to do that?

Body:
Can do something like this in java :

   ArrayList<String> idList = new ArrayList <String>();

   String id = "12,32,544,877,136,987";

   String idArr[] = id.split(",");
   for(String idVal: idArr){
       idList.add(idVal);
   }


问:
Vertical align not working inside table column
I have a table with 4 cells (2 rows, 2 columns).

Inside every cell I have a table with different heights.

When I display this table I see this:

But I want them to be vertically on the top of their cell, like this:

I have tried to add this class to the external table:

```<code>.externalTable tr td  {
      vertical-align: top;
}
</code>```

or

```<code>.externalTable  {
      vertical-align: top;
}
</code>```

without success... any ideas?

答:
Specify height of the cell and try to give like this.</p>

```<code>#cellID{
    display: flex;
    height: 50vh; //height of the cell
    justify-content: center;
    align-items: flex-start;
}
</code>```

Body:
I have a table with 4 cells (2 rows, 2 columns).

Inside every cell I have a table with different heights.

When I display this table I see this:

But I want them to be vertically on the top of their cell, like this:

I have tried to add this class to the external table:

.externalTable tr td  {
      vertical-align: top;
}

or

.externalTable  {
      vertical-align: top;
}

without success... any ideas?

Body:
Specify height of the cell and try to give like this.

#cellID{
    display: flex;
    height: 50vh; //height of the cell
    justify-content: center;
    align-items: flex-start;
}


问:
How do I upload image in vuejs?
Please, below is my code in the script section of my vue component.

I'm getting all the input fields right but the image and video uploads are showing empty values.

I have tried to solve this issue but to no avail.

```<code>        playVideo(url) {
            let video = $('#video-preview').get(0);
            video.preload = 'metadata';
            // Load video in Safari / IE11
            if (url) {
                video.muted = false;
                video.playsInline = true;
                video.play();
            }
        },

        // Read a file input as a data URL.
        readDataUrl(input, callback) {
            if (input.files && input.files[0]) {
                let fileReader = new FileReader();
                fileReader.onload = function () {
                    callback(fileReader.result);
                };
                fileReader.readAsDataURL(input.files[0]);
            }
            else {
                callback(null);
            }
        },

        // Read a file input as an object url.
        readObjectUrl(input, callback) {
            if (input.files && input.files[0]) {
                let fileReader = new FileReader();
                fileReader.onload = function () {
                    let blob = new Blob([fileReader.result], {type: input.files[0].type});
                    let url = URL.createObjectURL(blob);
                    callback(url, blob);
                };
                fileReader.readAsArrayBuffer(input.files[0]);
            }
            else {
                callback(null);
            }

        },

    }

}
</code>```

What exactly I want to achieve is upload image and video file, preview them before saving as blob.

The above image shows my response @samayo

The image and video blob are showing empty values.

答:
If you are using axios or fetch uploading files with vue is pretty easy.

This is a copy/pasta from my current project. I use axios to upload images:

First you'll need to have your input look like this:

```<code><input type="file" accept="image/*" @change="uploadImage($event)" id="file-input">
</code>```

Then add a method like this:

```<code>methods: {

  uploadImage(event) {

    const URL = 'http://foobar.com/upload';

    let data = new FormData();
    data.append('name', 'my-picture');
    data.append('file', event.target.files[0]);

    let config = {
      header : {
        'Content-Type' : 'image/png'
      }
    }

    axios.put(
      URL,
      data,
      config
    ).then(
      response => {
        console.log('image upload response > ', response)
      }
    )
  }
}
</code>```

Title: How do I upload image in vuejs?

Body:
Please, below is my code in the script section of my vue component.

I'm getting all the input fields right but the image and video uploads are showing empty values.

I have tried to solve this issue but to no avail.

        playVideo(url) {
            let video = $('#video-preview').get(0);
            video.preload = 'metadata';
            // Load video in Safari / IE11
            if (url) {
                video.muted = false;
                video.playsInline = true;
                video.play();
            }
        },

        // Read a file input as a data URL.
        readDataUrl(input, callback) {
            if (input.files && input.files[0]) {
                let fileReader = new FileReader();
                fileReader.onload = function () {
                    callback(fileReader.result);
                };
                fileReader.readAsDataURL(input.files[0]);
            }
            else {
                callback(null);
            }
        },

        // Read a file input as an object url.
        readObjectUrl(input, callback) {
            if (input.files && input.files[0]) {
                let fileReader = new FileReader();
                fileReader.onload = function () {
                    let blob = new Blob([fileReader.result], {type: input.files[0].type});
                    let url = URL.createObjectURL(blob);
                    callback(url, blob);
                };
                fileReader.readAsArrayBuffer(input.files[0]);
            }
            else {
                callback(null);
            }

        },

    }

}

What exactly I want to achieve is upload image and video file, preview them before saving as blob.

The above image shows my response @samayo

The image and video blob are showing empty values.

Body:
If you are using axios or fetch uploading files with vue is pretty easy.

This is a copy/pasta from my current project. I use axios to upload images:

First you'll need to have your input look like this:

<input type="file" accept="image/*" @change="uploadImage($event)" id="file-input">

Then add a method like this:

methods: {

  uploadImage(event) {

    const URL = 'http://foobar.com/upload';

    let data = new FormData();
    data.append('name', 'my-picture');
    data.append('file', event.target.files[0]);

    let config = {
      header : {
        'Content-Type' : 'image/png'
      }
    }

    axios.put(
      URL,
      data,
      config
    ).then(
      response => {
        console.log('image upload response > ', response)
      }
    )
  }
}


问:
How to prevent page from refreshing on selection of First Drop Down List value
I have Two 'DropDownLists' which I want to Fill with the help of first 'DropDownList'. I have successfully filled both 'DropDownLists' but when I select the value from the first 'DropDownList', my page refreshes every time. Please help me. What should I do or how to prevent page form refreshing?</p>

答:
use javascript  </p>

```<code>$(".firstdropdown").change(function()
{
    var value=$(this).val();
    $.ajax
    ({
        type: "GET",
        url: './ajax/value.php?firstdropdown='+value,
        cache: false,
        success: function(html)
        {
            $("#seconddropdown").val(html);
        }
    });
});
</code>```

Body:
use javascript

$(".firstdropdown").change(function()
{
    var value=$(this).val();
    $.ajax
    ({
        type: "GET",
        url: './ajax/value.php?firstdropdown='+value,
        cache: false,
        success: function(html)
        {
            $("#seconddropdown").val(html);
        }
    });
});


问:
concatenate multi-index dataframe with dataframe
I am trying to concatenate 2 dataframe df1 and df2
df1 is a multiindex dataframe and df2 has less rows than df1

```<code>import pandas as pd
import numpy as np
arrays = [['bar', 'bar', 'baz', 'baz', 'foo', 'foo', 'qux', 'qux'],
          ['one', 'two', 'one', 'two', 'one', 'two', 'one', 'two']]
tuples = list(zip(*arrays))
index = pd.MultiIndex.from_tuples(tuples, names=['first', 'second'])
df1 = pd.DataFrame(np.random.randn(8), index=index)

df1
Out[15]:
                     0
first second
bar   one    -0.185560
      two    -2.358254
baz   one     1.130550
      two     1.441708
foo   one    -1.163076
      two     1.776814
qux   one    -0.811836
      two     0.389500

df2 = pd.DataFrame(data=[0,1,0,1],index=['bar','baz','foo', 'qux'],columns=['label'])

df2
Out[18]:
     label
bar      0
baz      1
foo      0
qux      1
</code>```

The desired result would be something like:

```<code>df3
Out[18]:
                     0      label
first second
bar   one    -0.185560          0
      two    -2.358254          0
baz   one     1.130550          1
      two     1.441708          1
foo   one    -1.163076          0
      two     1.776814          0
qux   one    -0.811836          1
      two     0.389500          1
</code>```

答:
```<code>In [132]: df1['label'] = df1.index.get_level_values(0).to_series().map(df2['label']).values

In [133]: df1
Out[133]:
                     0  label
first second
bar   one     0.143211      0
      two     1.133454      0
baz   one     1.298973      1
      two    -0.717844      1
foo   one    -0.663768      0
      two     0.687015      0
qux   one     0.412729      1
      two     0.366502      1
</code>```

or a better option (thanks to @Dark for the hint):

```<code>df1['label'] = df1.index.get_level_values(0).map(df2['label'].get)
</code>```

Body:
I am trying to concatenate 2 dataframe df1 and df2
df1 is a multiindex dataframe and df2 has less rows than df1

import pandas as pd
import numpy as np
arrays = [['bar', 'bar', 'baz', 'baz', 'foo', 'foo', 'qux', 'qux'],
          ['one', 'two', 'one', 'two', 'one', 'two', 'one', 'two']]
tuples = list(zip(*arrays))
index = pd.MultiIndex.from_tuples(tuples, names=['first', 'second'])
df1 = pd.DataFrame(np.random.randn(8), index=index)

df1
Out[15]:
                     0
first second
bar   one    -0.185560
      two    -2.358254
baz   one     1.130550
      two     1.441708
foo   one    -1.163076
      two     1.776814
qux   one    -0.811836
      two     0.389500

df2 = pd.DataFrame(data=[0,1,0,1],index=['bar','baz','foo', 'qux'],columns=['label'])

df2
Out[18]:
     label
bar      0
baz      1
foo      0
qux      1

The desired result would be something like:

df3
Out[18]:
                     0      label
first second
bar   one    -0.185560          0
      two    -2.358254          0
baz   one     1.130550          1
      two     1.441708          1
foo   one    -1.163076          0
      two     1.776814          0
qux   one    -0.811836          1
      two     0.389500          1

Body:
In [132]: df1['label'] = df1.index.get_level_values(0).to_series().map(df2['label']).values

In [133]: df1
Out[133]:
                     0  label
first second
bar   one     0.143211      0
      two     1.133454      0
baz   one     1.298973      1
      two    -0.717844      1
foo   one    -0.663768      0
      two     0.687015      0
qux   one     0.412729      1
      two     0.366502      1

or a better option (thanks to @Dark for the hint):

df1['label'] = df1.index.get_level_values(0).map(df2['label'].get)


问:
Hide Div until hover on icon
I have hit a brick wall on this one, I am working on a website where I need to hide a DIV of extra content until the user hovers over an icon but I cannot figure out how to do this. I have tried various different ways (>, + and ~) but I just cant get it to work.

HTML

.fa-canapes-icon:hover .canapes-popup{
    display:block;

}```
<pre class="snippet-code-html lang-html prettyprint-override"><code><div class="canapes">
<p>Canapes <i class="fa fa-info-circle fa-canapes-icon"></i></p>
<div class="canapes-popup">
<h1>Example Canape Menu</h1>
<p>This is a popular selection. We do of course have other options we are happy to discuss with you.<br>
Mini Yorkshires with Medium Roast Beef and Horseradish<br>
Satay Chicken Skewers with a Peanut Sauce<br>
Spicy Prawn with Mango<br>
Smoked Salmon & Mascarpone crostini with Dill & Lemon<br>
Mozzerella Pearls with Sun-blush tomatoes & Fresh Basil (V)<br>
Honey and Sesame Coated Cocktail Sausages</p>
</div>
</div></code>```

The page can be viewed here and it is the 'wedding package 3' with the canapes i icon that I am trying to add it onto.

Any help would be greatly appreciated.

答:
Your css would suggest that .canapes-popup is a child of .fa-canapes-icon looking at your html however this is not the case.

Have you tried the adjacent sibling selector. This allows you to select a an element that is directly after one specified.

For example you could try:

```<code>.fa-canapes-icon:hover + .canapes-popup{
    display:block;
}
</code>```

Hope this helps

Title: Hide Div until hover on icon

Body:
I have hit a brick wall on this one, I am working on a website where I need to hide a DIV of extra content until the user hovers over an icon but I cannot figure out how to do this. I have tried various different ways (>, + and ~) but I just cant get it to work.

HTML

.fa-canapes-icon:hover .canapes-popup{
    display:block;

}

Canapes

Example Canape Menu

This is a popular selection. We do of course have other options we are happy to discuss with you.

Mini Yorkshires with Medium Roast Beef and Horseradish

Satay Chicken Skewers with a Peanut Sauce

Spicy Prawn with Mango

Smoked Salmon & Mascarpone crostini with Dill & Lemon

Mozzerella Pearls with Sun-blush tomatoes & Fresh Basil (V)

Honey and Sesame Coated Cocktail Sausages

The page can be viewed here and it is the 'wedding package 3' with the canapes i icon that I am trying to add it onto.

Any help would be greatly appreciated.

Body:
Your css would suggest that .canapes-popup is a child of .fa-canapes-icon looking at your html however this is not the case.

Have you tried the adjacent sibling selector. This allows you to select a an element that is directly after one specified.

For example you could try:

.fa-canapes-icon:hover + .canapes-popup{
    display:block;
}

Hope this helps


问:
Java config instead of @ComponentScan
Is there a way to create Java-based configuration class that does exactly same as @ComponentScan(basePackageClasses = {X.class})  ?

I have to create generic configuration class (for extending in tests) doing something like that:

```<code>@Configuration
@ComponentScan(basePackageClasses = T.class)
public class EndpointTestConfig<T> {
}
</code>```

It's impossible to use generics with annotations so I would need the same effect using Java.

答:
I'm not sure what exactly you are trying to achieve. If I understand you correctly you have a base class T and a lot of derived classes? And you want to have a base config that will create common beans and every extender will create a bean of class that extends T? So you can do something like that:

```<code>@Configuration
public class BaseTestConfig {
  //common beans
}

@Configuration
@Import(BaseTestConfig.class)
public class ConcreteEndpointConfig {

  @Bean
  public YourDerivedClass bean() {
    return new YourDerivedClass();
  }
}
</code>```

I hope that I got your idea. If this is not what you need please elaborate.

Title: Java config instead of @ComponentScan

Body:
Is there a way to create Java-based configuration class that does exactly same as @ComponentScan(basePackageClasses = {X.class})  ?

I have to create generic configuration class (for extending in tests) doing something like that:

@Configuration
@ComponentScan(basePackageClasses = T.class)
public class EndpointTestConfig<T> {
}

It's impossible to use generics with annotations so I would need the same effect using Java.

Body:
I'm not sure what exactly you are trying to achieve. If I understand you correctly you have a base class T and a lot of derived classes? And you want to have a base config that will create common beans and every extender will create a bean of class that extends T? So you can do something like that:

@Configuration
public class BaseTestConfig {
  //common beans
}

@Configuration
@Import(BaseTestConfig.class)
public class ConcreteEndpointConfig {

  @Bean
  public YourDerivedClass bean() {
    return new YourDerivedClass();
  }
}

I hope that I got your idea. If this is not what you need please elaborate.


问:
if data = null error Invalid argument supplied for foreach()
I'm will insert arrays into the database. If there is information, it will not error.
I try to find a solution to brush the brush from this site. But it was not successful.

this is my code

controller

```<code> $new = new Checks();
    $new->nvr_id = Input::get('nvr_id');
    $new->check_date = Input::get('check_date');
    $new->status_record = Input::get('check_record');
    $new->status_hdd = Input::get('check_hdd');
    $new->status_camera = Input::get('check_camera');
    $new->comment = Input::get('comment');
    $new->save();
    $id = $new->id;
    $issue[] = Input::get('issue');
    if ($issue == null) {

    } elseif (!empty($issue)) {
        foreach ($issue as $item) {
            foreach ($item as $item1) {
                addIssues::create([
                    'check_id' => $id,
                    'issue_id' => $item1
                ]);
            }
        }
    }
</code>```

create.blade.php

```<code><select name="issue[]" id="issue" class="form-control" multiple="multiple">
    @foreach($issue as $key => $item)
        <option value = "{{ $key }}" > { { $item } } < /option>
    @endforeach
</select>
</code>```

database relationship

issue  1 to m  addIssues m to 1 check

答:
Change the create.blade.php code to this

```<code><select name="issue[]" id="issue" class="form-control" multiple="multiple">
  @if(count($issue))
    @foreach($issue as $key => $item)
        <option value = "{{ $key }}" > { { $item } } < /option>
    @endforeach
  @endif
</select>
</code>```

The @if construct will handle the error.

Body:
I'm will insert arrays into the database. If there is information, it will not error.
I try to find a solution to brush the brush from this site. But it was not successful.

this is my code

controller

 $new = new Checks();
    $new->nvr_id = Input::get('nvr_id');
    $new->check_date = Input::get('check_date');
    $new->status_record = Input::get('check_record');
    $new->status_hdd = Input::get('check_hdd');
    $new->status_camera = Input::get('check_camera');
    $new->comment = Input::get('comment');
    $new->save();
    $id = $new->id;
    $issue[] = Input::get('issue');
    if ($issue == null) {

    } elseif (!empty($issue)) {
        foreach ($issue as $item) {
            foreach ($item as $item1) {
                addIssues::create([
                    'check_id' => $id,
                    'issue_id' => $item1
                ]);
            }
        }
    }

create.blade.php

<select name="issue[]" id="issue" class="form-control" multiple="multiple">
    @foreach($issue as $key => $item)
        <option value = "{{ $key }}" > { { $item } } < /option>
    @endforeach
</select>

database relationship

issue  1 to m  addIssues m to 1 check

Body:
Change the create.blade.php code to this

<select name="issue[]" id="issue" class="form-control" multiple="multiple">
  @if(count($issue))
    @foreach($issue as $key => $item)
        <option value = "{{ $key }}" > { { $item } } < /option>
    @endforeach
  @endif
</select>

The @if construct will handle the error.


问:
Where do I find the new Span<T>?
Everyone is writing about how great the new type Span<T> is so I eagerly wanted to start rewriting a couple of methods in my libraries but where do I actually find it? I've updated Visual Studio 2017 to the latest version 15.5.0 where the change-log says:

The C# compiler now supports the 7.2 set of language features including:

Support for the Span<T> type being used throughout Kestrel and CoreFX via the ref struct modifier.

but when I try to use it my code I'm getting an error and intellisense cannot resolve it. It's a .net 4.6.2 project and the language version is set to latest minor.

Do I need to install some NuGet package in order to be able to use it? I can't figure this out.

答: You need to install prerelease version (check "Include prerelease" checkbox in nuget manager) of System.Memory package. Then just use Span (it's in System namespace).

Title: Where do I find the new Span<T>?


问:
bytes32 to string in javascript
currently i'm working on a ethereum dapp(voting), in my smart contract i have a function to fetch candidate list of type bytes32[] , on the java script side i'm not getting the values instead 0x only
How to parse the value , below is the code

```<code>pragma solidity ^0.4.0;

contract Voting {

  mapping (bytes32 => uint8) public votesReceived;

  bytes32[] public candidateList;
string myString = "someString";

  function Voting(bytes32[] candidateNames) public {
    candidateList = candidateNames ;

  }

  function totalVotesFor(bytes32 candidate) view public returns (uint8) {
    return votesReceived[candidate];
  }

  function addCandidate(bytes32 candidate)  public returns (bool){
    require(isNewEntry(candidate));
    candidateList.push(candidate);
    return isNewEntry(candidate);
  }

  function voteForCandidate(bytes32 candidate) public {
    require(validCandidate(candidate));
    votesReceived[candidate] += 1;
  }

  function getCandidateList() view public returns (bytes32[]) {
return candidateList;
  }

  function isNewEntry(bytes32 candidate) view public returns (bool) {
    for(uint i = 0; i < candidateList.length; i++) {
        if (candidateList[i] == candidate) {
            return false;
        }
    }
    return true;
  }

  function validCandidate(bytes32 candidate) view public returns (bool) {
    for(uint i = 0; i < candidateList.length; i++) {
      if (candidateList[i] == candidate) {
        return true;
      }
    }
    return false;
  }
}
</code>```

below is the code to access the contract function

```<code>Voting.deployed().then(function(contractInstance) {
    contractInstance.getCandidateList.call().then(function(v) {
    console.log(v)
    });
  })
</code>```

someone please help me

答:
Assuming you're using web3 on the JS side, it's web3.toAscii.

Example from the docs:

```<code>var str = web3.toAscii("0x657468657265756d000000000000000000000000000000000000000000000000");
console.log(str); // "ethereum"
</code>```

Title: bytes32 to string in javascript

Body:
currently i'm working on a ethereum dapp(voting), in my smart contract i have a function to fetch candidate list of type bytes32[] , on the java script side i'm not getting the values instead 0x only
How to parse the value , below is the code

pragma solidity ^0.4.0;

contract Voting {

  mapping (bytes32 => uint8) public votesReceived;

  bytes32[] public candidateList;
string myString = "someString";

  function Voting(bytes32[] candidateNames) public {
    candidateList = candidateNames ;

  }

  function totalVotesFor(bytes32 candidate) view public returns (uint8) {
    return votesReceived[candidate];
  }

  function addCandidate(bytes32 candidate)  public returns (bool){
    require(isNewEntry(candidate));
    candidateList.push(candidate);
    return isNewEntry(candidate);
  }

  function voteForCandidate(bytes32 candidate) public {
    require(validCandidate(candidate));
    votesReceived[candidate] += 1;
  }

  function getCandidateList() view public returns (bytes32[]) {
return candidateList;
  }

  function isNewEntry(bytes32 candidate) view public returns (bool) {
    for(uint i = 0; i < candidateList.length; i++) {
        if (candidateList[i] == candidate) {
            return false;
        }
    }
    return true;
  }

  function validCandidate(bytes32 candidate) view public returns (bool) {
    for(uint i = 0; i < candidateList.length; i++) {
      if (candidateList[i] == candidate) {
        return true;
      }
    }
    return false;
  }
}

below is the code to access the contract function

Voting.deployed().then(function(contractInstance) {
    contractInstance.getCandidateList.call().then(function(v) {
    console.log(v)
    });
  })

someone please help me

Body:
Assuming you're using web3 on the JS side, it's web3.toAscii.

Example from the docs:

var str = web3.toAscii("0x657468657265756d000000000000000000000000000000000000000000000000");
console.log(str); // "ethereum"


问:
How can I lock stickerview on an imageview using com.xiaopo.flying.sticker.StickerView
Here is my Code i have  an sticker on an image View after chose it from Recycler View  all functions perform accurate rather when I want to lock a sticker on image view it did not work how can i use MOTION EVENT to lock sticker on image view and then save it
i did not know what method i can use kindly please answer my question.</p>

```<code>    private float[] mOriginPoints;
    private float[] mPoints;
    private RectF mOriginContentRect;
    private RectF mContentRect;
    private RectF mViewRect;

    private float mLastPointX, mLastPointY;

    private Bitmap mBitmap;
    private Bitmap mControllerBitmap, mDeleteBitmap;
    private Matrix mMatrix;
    private Paint mPaint, mBorderPaint;
    private float mControllerWidth, mControllerHeight, mDeleteWidth, mDeleteHeight;
    private boolean mInController, mInMove;

    private boolean mDrawController = true;
    //private boolean mCanTouch;
    private float mStickerScaleSize = 1.0f;

    private OnStickerDeleteListener mOnStickerDeleteListener;

    public StickerView(Context context) {
        this(context, null);
    }

    public StickerView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public StickerView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init();
    }

    private void init() {

        mPaint = new Paint();
        mPaint.setAntiAlias(true);
        mPaint.setFilterBitmap(true);
        mPaint.setStyle(Paint.Style.STROKE);
        mPaint.setStrokeWidth(4.0f);
        mPaint.setColor(Color.WHITE);

        mBorderPaint = new Paint(mPaint);
        mBorderPaint.setColor(Color.parseColor("#B2ffffff"));
        mBorderPaint.setShadowLayer(DisplayUtil.dip2px(getContext(), 2.0f), 0, 0, Color.parseColor("#33000000"));

        mControllerBitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.ic_sticker_control);
        mControllerWidth = mControllerBitmap.getWidth();
        mControllerHeight = mControllerBitmap.getHeight();

        mDeleteBitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.ic_sticker_delete);
        mDeleteWidth = mDeleteBitmap.getWidth();
        mDeleteHeight = mDeleteBitmap.getHeight();

    }

    public void setWaterMark(@NonNull Bitmap bitmap) {
        mBitmap = bitmap;
        mStickerScaleSize = 1.0f;

        setFocusable(true);
        try {

            float px = mBitmap.getWidth();
            float py = mBitmap.getHeight();

            //mOriginPoints = new float[]{px, py, px + bitmap.getWidth(), py, bitmap.getWidth() + px, bitmap.getHeight() + py, px, py + bitmap.getHeight()};
            mOriginPoints = new float[]{0, 0, px, 0, px, py, 0, py, px / 2, py / 2};
            mOriginContentRect = new RectF(0, 0, px, py);
            mPoints = new float[10];
            mContentRect = new RectF();

            mMatrix = new Matrix();
            float transtLeft = ((float)DisplayUtil.getDisplayWidthPixels(getContext()) - mBitmap.getWidth()) / 2;
            float transtTop = ((float)DisplayUtil.getDisplayWidthPixels(getContext()) - mBitmap.getHeight()) / 2;

            mMatrix.postTranslate(transtLeft, transtTop);

        } catch (Exception e) {
            e.printStackTrace();
        }
        postInvalidate();

    }

    public Matrix getMarkMatrix() {
        return mMatrix;
    }

    @Override
    public void setFocusable(boolean focusable) {
        super.setFocusable(focusable);
        postInvalidate();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if (mBitmap == null || mMatrix == null) {
            return;
        }

        mMatrix.mapPoints(mPoints, mOriginPoints);

        mMatrix.mapRect(mContentRect, mOriginContentRect);
        canvas.drawBitmap(mBitmap, mMatrix, mPaint);
        if (mDrawController && isFocusable()) {
            canvas.drawLine(mPoints[0], mPoints[1], mPoints[2], mPoints[3], mBorderPaint);
            canvas.drawLine(mPoints[2], mPoints[3], mPoints[4], mPoints[5], mBorderPaint);
            canvas.drawLine(mPoints[4], mPoints[5], mPoints[6], mPoints[7], mBorderPaint);
            canvas.drawLine(mPoints[6], mPoints[7], mPoints[0], mPoints[1], mBorderPaint);
            canvas.drawBitmap(mControllerBitmap, mPoints[4] - mControllerWidth / 2, mPoints[5] - mControllerHeight / 2, mBorderPaint);
            canvas.drawBitmap(mDeleteBitmap, mPoints[0] - mDeleteWidth / 2, mPoints[1] - mDeleteHeight / 2, mBorderPaint);
        }
    }

    public Bitmap getBitmap() {
        Bitmap bitmap = Bitmap.createBitmap(getWidth(), getHeight(), Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(bitmap);
        mDrawController = false;
        draw(canvas);
        mDrawController = true;
        canvas.save();
        return bitmap;
    }

    public void setShowDrawController(boolean show) {
        mDrawController = show;
    }

    private boolean isInController(float x, float y) {
        int position = 4;
        //while (position < 8) {
            float rx = mPoints[position];
            float ry = mPoints[position + 1];
            RectF rectF = new RectF(rx - mControllerWidth / 2,
                    ry - mControllerHeight / 2,
                    rx + mControllerWidth / 2,
                    ry + mControllerHeight / 2);
            if (rectF.contains(x, y)) {
                return true;
            }
         //   position += 2;
        //}
        return false;

    }

    private boolean isInDelete(float x, float y) {
        int position = 0;
        //while (position < 8) {
        float rx = mPoints[position];
        float ry = mPoints[position + 1];
        RectF rectF = new RectF(rx - mDeleteWidth / 2,
                ry - mDeleteHeight / 2,
                rx + mDeleteWidth / 2,
                ry + mDeleteHeight / 2);
        if (rectF.contains(x, y)) {
            return true;
        }
        //   position += 2;
        //}
        return false;

    }

    private boolean mInDelete = false;
    @Override
    public boolean dispatchTouchEvent(MotionEvent event) {
        if (!isFocusable()) {
            return super.dispatchTouchEvent(event);
        }
        if (mViewRect == null) {
            mViewRect = new RectF(0f, 0f, getMeasuredWidth(), getMeasuredHeight());
        }
        float x = event.getX();
        float y = event.getY();
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                if (isInController(x, y)) {
                    mInController = true;
                    mLastPointY = y;
                    mLastPointX = x;
                    break;
                }

                if (isInDelete(x, y)) {
                    mInDelete = true;
                    break;
                }

                if (mContentRect.contains(x, y)) {
                    mLastPointY = y;
                    mLastPointX = x;
                    mInMove = true;
                }
                break;
            case MotionEvent.ACTION_UP:
                if (isInDelete(x, y) && mInDelete) {
                    doDeleteSticker();
                }
            case MotionEvent.ACTION_OUTSIDE:
                Log.d(TAG, "Movement occurred outside bounds of current screen element");
                return true;
            case MotionEvent.ACTION_CANCEL:
                mLastPointX = 0;
                mLastPointY = 0;
                mInController = false;
                mInMove = false;
                mInDelete = false;
                break;
            case MotionEvent.ACTION_MOVE:
                if (mInController) {
                    mMatrix.postRotate(rotation(event), mPoints[8], mPoints[9]);
                    float nowLenght = caculateLength(mPoints[0], mPoints[1]);
                    float touchLenght = caculateLength(event.getX(), event.getY());
                    if ((float)Math.sqrt((nowLenght - touchLenght) * (nowLenght - touchLenght)) > 0.0f) {
                        float scale = touchLenght / nowLenght;
                        float nowsc = mStickerScaleSize * scale;
                        if (nowsc >= MIN_SCALE_SIZE && nowsc <= MAX_SCALE_SIZE) {
                            mMatrix.postScale(scale, scale, mPoints[8], mPoints[9]);
                            mStickerScaleSize = nowsc;
                        }
                    }

                    invalidate();
                    mLastPointX = x;
                    mLastPointY = y;
                    break;

                }

                if (mInMove == true) { //拖动的操作
                    float cX = x - mLastPointX;
                    float cY = y - mLastPointY;
                    mInController = false;
                    //Log.i("MATRIX_OK", "ma_jiaodu:" + a(cX, cY));

                    if ((float)Math.sqrt(cX * cX + cY * cY) > 2.0f && canStickerMove(cX, cY)) {
                        //Log.i("MATRIX_OK", "is true to move");
                        mMatrix.postTranslate(cX, cY);
                        postInvalidate();
                        mLastPointX = x;
                        mLastPointY = y;
                    }
                    break;
                }

                return true;

        }
        return true;
    }

    private void doDeleteSticker() {
        setVisibility(View.GONE);
        if (mOnStickerDeleteListener != null) {
            mOnStickerDeleteListener.onDelete(this);
        }
    }

    private boolean canStickerMove(float cx, float cy) {
        float px = cx + mPoints[8];
        float py = cy + mPoints[9];
        if (mViewRect.contains(px, py)) {
            return true;
        } else {
            return false;
        }
    }

    private float caculateLength(float x, float y) {
        float ex = x - mPoints[8];
        float ey = y - mPoints[9];
        return (float)Math.sqrt(ex*ex + ey*ey);
    }

    private float rotation(MotionEvent event) {
        float  originDegree = calculateDegree(mLastPointX, mLastPointY);
        float nowDegree = calculateDegree(event.getX(), event.getY());
        return nowDegree - originDegree;
    }

    private float calculateDegree(float x, float y) {
        double delta_x = x - mPoints[8];
        double delta_y = y - mPoints[9];
        double radians = Math.atan2(delta_y, delta_x);
        return (float) Math.toDegrees(radians);
    }

    public RectF getContentRect(){
        return mContentRect;
    }

    public interface OnStickerDeleteListener {
        public void onDelete(StickerView stickerView);
    }

    public void setOnStickerDeleteListener(OnStickerDeleteListener listener) {
        mOnStickerDeleteListener = listener;
    }
}
</code>```

答:
stickerview.setLock(true);

it works fine.

Body:
Here is my Code i have  an sticker on an image View after chose it from Recycler View  all functions perform accurate rather when I want to lock a sticker on image view it did not work how can i use MOTION EVENT to lock sticker on image view and then save it
i did not know what method i can use kindly please answer my question.

    private float[] mOriginPoints;
    private float[] mPoints;
    private RectF mOriginContentRect;
    private RectF mContentRect;
    private RectF mViewRect;

    private float mLastPointX, mLastPointY;

    private Bitmap mBitmap;
    private Bitmap mControllerBitmap, mDeleteBitmap;
    private Matrix mMatrix;
    private Paint mPaint, mBorderPaint;
    private float mControllerWidth, mControllerHeight, mDeleteWidth, mDeleteHeight;
    private boolean mInController, mInMove;

    private boolean mDrawController = true;
    //private boolean mCanTouch;
    private float mStickerScaleSize = 1.0f;

    private OnStickerDeleteListener mOnStickerDeleteListener;

    public StickerView(Context context) {
        this(context, null);
    }

    public StickerView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public StickerView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        init();
    }

    private void init() {

        mPaint = new Paint();
        mPaint.setAntiAlias(true);
        mPaint.setFilterBitmap(true);
        mPaint.setStyle(Paint.Style.STROKE);
        mPaint.setStrokeWidth(4.0f);
        mPaint.setColor(Color.WHITE);

        mBorderPaint = new Paint(mPaint);
        mBorderPaint.setColor(Color.parseColor("#B2ffffff"));
        mBorderPaint.setShadowLayer(DisplayUtil.dip2px(getContext(), 2.0f), 0, 0, Color.parseColor("#33000000"));

        mControllerBitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.ic_sticker_control);
        mControllerWidth = mControllerBitmap.getWidth();
        mControllerHeight = mControllerBitmap.getHeight();

        mDeleteBitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.ic_sticker_delete);
        mDeleteWidth = mDeleteBitmap.getWidth();
        mDeleteHeight = mDeleteBitmap.getHeight();

    }

    public void setWaterMark(@NonNull Bitmap bitmap) {
        mBitmap = bitmap;
        mStickerScaleSize = 1.0f;

        setFocusable(true);
        try {

            float px = mBitmap.getWidth();
            float py = mBitmap.getHeight();

            //mOriginPoints = new float[]{px, py, px + bitmap.getWidth(), py, bitmap.getWidth() + px, bitmap.getHeight() + py, px, py + bitmap.getHeight()};
            mOriginPoints = new float[]{0, 0, px, 0, px, py, 0, py, px / 2, py / 2};
            mOriginContentRect = new RectF(0, 0, px, py);
            mPoints = new float[10];
            mContentRect = new RectF();

            mMatrix = new Matrix();
            float transtLeft = ((float)DisplayUtil.getDisplayWidthPixels(getContext()) - mBitmap.getWidth()) / 2;
            float transtTop = ((float)DisplayUtil.getDisplayWidthPixels(getContext()) - mBitmap.getHeight()) / 2;

            mMatrix.postTranslate(transtLeft, transtTop);

        } catch (Exception e) {
            e.printStackTrace();
        }
        postInvalidate();

    }

    public Matrix getMarkMatrix() {
        return mMatrix;
    }

    @Override
    public void setFocusable(boolean focusable) {
        super.setFocusable(focusable);
        postInvalidate();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if (mBitmap == null || mMatrix == null) {
            return;
        }

        mMatrix.mapPoints(mPoints, mOriginPoints);

        mMatrix.mapRect(mContentRect, mOriginContentRect);
        canvas.drawBitmap(mBitmap, mMatrix, mPaint);
        if (mDrawController && isFocusable()) {
            canvas.drawLine(mPoints[0], mPoints[1], mPoints[2], mPoints[3], mBorderPaint);
            canvas.drawLine(mPoints[2], mPoints[3], mPoints[4], mPoints[5], mBorderPaint);
            canvas.drawLine(mPoints[4], mPoints[5], mPoints[6], mPoints[7], mBorderPaint);
            canvas.drawLine(mPoints[6], mPoints[7], mPoints[0], mPoints[1], mBorderPaint);
            canvas.drawBitmap(mControllerBitmap, mPoints[4] - mControllerWidth / 2, mPoints[5] - mControllerHeight / 2, mBorderPaint);
            canvas.drawBitmap(mDeleteBitmap, mPoints[0] - mDeleteWidth / 2, mPoints[1] - mDeleteHeight / 2, mBorderPaint);
        }
    }

    public Bitmap getBitmap() {
        Bitmap bitmap = Bitmap.createBitmap(getWidth(), getHeight(), Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(bitmap);
        mDrawController = false;
        draw(canvas);
        mDrawController = true;
        canvas.save();
        return bitmap;
    }

    public void setShowDrawController(boolean show) {
        mDrawController = show;
    }

    private boolean isInController(float x, float y) {
        int position = 4;
        //while (position < 8) {
            float rx = mPoints[position];
            float ry = mPoints[position + 1];
            RectF rectF = new RectF(rx - mControllerWidth / 2,
                    ry - mControllerHeight / 2,
                    rx + mControllerWidth / 2,
                    ry + mControllerHeight / 2);
            if (rectF.contains(x, y)) {
                return true;
            }
         //   position += 2;
        //}
        return false;

    }

    private boolean isInDelete(float x, float y) {
        int position = 0;
        //while (position < 8) {
        float rx = mPoints[position];
        float ry = mPoints[position + 1];
        RectF rectF = new RectF(rx - mDeleteWidth / 2,
                ry - mDeleteHeight / 2,
                rx + mDeleteWidth / 2,
                ry + mDeleteHeight / 2);
        if (rectF.contains(x, y)) {
            return true;
        }
        //   position += 2;
        //}
        return false;

    }

    private boolean mInDelete = false;
    @Override
    public boolean dispatchTouchEvent(MotionEvent event) {
        if (!isFocusable()) {
            return super.dispatchTouchEvent(event);
        }
        if (mViewRect == null) {
            mViewRect = new RectF(0f, 0f, getMeasuredWidth(), getMeasuredHeight());
        }
        float x = event.getX();
        float y = event.getY();
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                if (isInController(x, y)) {
                    mInController = true;
                    mLastPointY = y;
                    mLastPointX = x;
                    break;
                }

                if (isInDelete(x, y)) {
                    mInDelete = true;
                    break;
                }

                if (mContentRect.contains(x, y)) {
                    mLastPointY = y;
                    mLastPointX = x;
                    mInMove = true;
                }
                break;
            case MotionEvent.ACTION_UP:
                if (isInDelete(x, y) && mInDelete) {
                    doDeleteSticker();
                }
            case MotionEvent.ACTION_OUTSIDE:
                Log.d(TAG, "Movement occurred outside bounds of current screen element");
                return true;
            case MotionEvent.ACTION_CANCEL:
                mLastPointX = 0;
                mLastPointY = 0;
                mInController = false;
                mInMove = false;
                mInDelete = false;
                break;
            case MotionEvent.ACTION_MOVE:
                if (mInController) {
                    mMatrix.postRotate(rotation(event), mPoints[8], mPoints[9]);
                    float nowLenght = caculateLength(mPoints[0], mPoints[1]);
                    float touchLenght = caculateLength(event.getX(), event.getY());
                    if ((float)Math.sqrt((nowLenght - touchLenght) * (nowLenght - touchLenght)) > 0.0f) {
                        float scale = touchLenght / nowLenght;
                        float nowsc = mStickerScaleSize * scale;
                        if (nowsc >= MIN_SCALE_SIZE && nowsc <= MAX_SCALE_SIZE) {
                            mMatrix.postScale(scale, scale, mPoints[8], mPoints[9]);
                            mStickerScaleSize = nowsc;
                        }
                    }

                    invalidate();
                    mLastPointX = x;
                    mLastPointY = y;
                    break;

                }

                if (mInMove == true) { //拖动的操作
                    float cX = x - mLastPointX;
                    float cY = y - mLastPointY;
                    mInController = false;
                    //Log.i("MATRIX_OK", "ma_jiaodu:" + a(cX, cY));

                    if ((float)Math.sqrt(cX * cX + cY * cY) > 2.0f && canStickerMove(cX, cY)) {
                        //Log.i("MATRIX_OK", "is true to move");
                        mMatrix.postTranslate(cX, cY);
                        postInvalidate();
                        mLastPointX = x;
                        mLastPointY = y;
                    }
                    break;
                }

                return true;

        }
        return true;
    }

    private void doDeleteSticker() {
        setVisibility(View.GONE);
        if (mOnStickerDeleteListener != null) {
            mOnStickerDeleteListener.onDelete(this);
        }
    }

    private boolean canStickerMove(float cx, float cy) {
        float px = cx + mPoints[8];
        float py = cy + mPoints[9];
        if (mViewRect.contains(px, py)) {
            return true;
        } else {
            return false;
        }
    }

    private float caculateLength(float x, float y) {
        float ex = x - mPoints[8];
        float ey = y - mPoints[9];
        return (float)Math.sqrt(ex*ex + ey*ey);
    }

    private float rotation(MotionEvent event) {
        float  originDegree = calculateDegree(mLastPointX, mLastPointY);
        float nowDegree = calculateDegree(event.getX(), event.getY());
        return nowDegree - originDegree;
    }

    private float calculateDegree(float x, float y) {
        double delta_x = x - mPoints[8];
        double delta_y = y - mPoints[9];
        double radians = Math.atan2(delta_y, delta_x);
        return (float) Math.toDegrees(radians);
    }

    public RectF getContentRect(){
        return mContentRect;
    }

    public interface OnStickerDeleteListener {
        public void onDelete(StickerView stickerView);
    }

    public void setOnStickerDeleteListener(OnStickerDeleteListener listener) {
        mOnStickerDeleteListener = listener;
    }
}


问:
JavaScript slideshow not working (images are static)
I am quite new to JavaScript and I am trying to implement a slider. Below is the javascript code that I am trying to solve.

    <title> Home Page </title>

```

It is not working and the images are static. Any idea why? Thanks for helping in advance.

答:
If you add the the following css to your parent and child element, the problem with the positioning is fixed:

CSS:

```<code>#slideshow {
  position: relative;
}

#slideshow > div{
  position: absolute;
}
</code>```

here is a demo:
https://jsfiddle.net/cjd5ja7d/2/

But have you considered to use an external jquery plugin for your slideshow?
here are some great examples:

https://bxslider.com/ (easy to use)

http://idangero.us/swiper/ (more
advanced)

Body:
I am quite new to JavaScript and I am trying to implement a slider. Below is the javascript code that I am trying to solve.

    <title> Home Page </title>

It is not working and the images are static. Any idea why? Thanks for helping in advance.

Body:
If you add the the following css to your parent and child element, the problem with the positioning is fixed:

CSS:

#slideshow {
  position: relative;
}

#slideshow > div{
  position: absolute;
}

here is a demo:
https://jsfiddle.net/cjd5ja7d/2/

But have you considered to use an external jquery plugin for your slideshow?
here are some great examples:

https://bxslider.com/ (easy to use)

http://idangero.us/swiper/ (more
advanced)


问:
$_GET doesn't work
I have a really odd problem with $_GET. I'm fairly new to the HTML/CSS/PHP/MySQL stack. I've not used $_GET before and I'm trying to write a page that is used by a link in an email that confirms the user's email. The link contains a single parameter which is a GUID that I cross-reference against a database entry. While developing this, I've had problems getting hold of the $_GET parameters, so I've cut the page down to a test page thus:

```<code><html>
    <head>
    </head>
    <body>
        Hullo.<br/>
        <?php
            echo $_GET['testparam'];
        ?>
        <br/>
        World.
        <br/>
    </body>
</html>
</code>```

I am then calling this with:

```<code>http://mywebsite/dev/test.html?testparam=2
</code>```

I get the following output:

Hullo.

World.

What is going on? I cannot make the test simpler. I'm using PHP 7.1 if that helps. Any advice very gratefully received.

答:
I have run the test on my server setup and get the following response:

```<code>Hullo.
2
World.
</code>```

So it may be a case that PHP isn't configured properly. To test this try something such as setting a variable then printing it.

```<code><?PHP
$x = 2;
echo $x;
?>
</code>```

if this fails then read the PHP installation docs to make sure you have it installed correctly.
http://php.net/manual/en/install.php

EDIT:

Just noticed you are trying to do it off a HTML page. The page needs extension: .php .php5 .php7 and such.

Read here: http://php.net/manual/en/tutorial.php

Title: $_GET doesn't work

Body:
I have a really odd problem with $_GET. I'm fairly new to the HTML/CSS/PHP/MySQL stack. I've not used $_GET before and I'm trying to write a page that is used by a link in an email that confirms the user's email. The link contains a single parameter which is a GUID that I cross-reference against a database entry. While developing this, I've had problems getting hold of the $_GET parameters, so I've cut the page down to a test page thus:

        Hullo.

        <?php
            echo $_GET['testparam'];
        ?>

        World.

I am then calling this with:

http://mywebsite/dev/test.html?testparam=2

I get the following output:

Hullo.

World.

What is going on? I cannot make the test simpler. I'm using PHP 7.1 if that helps. Any advice very gratefully received.

Body:
I have run the test on my server setup and get the following response:

Hullo.
2
World.

So it may be a case that PHP isn't configured properly. To test this try something such as setting a variable then printing it.

<?PHP
$x = 2;
echo $x;
?>

if this fails then read the PHP installation docs to make sure you have it installed correctly.
http://php.net/manual/en/install.php

EDIT:

Just noticed you are trying to do it off a HTML page. The page needs extension: .php .php5 .php7 and such.

Read here: http://php.net/manual/en/tutorial.php


问:
How to get the userId of a newly registered user in ASP.NET MVC?
Im trying to get the userId stored in the AspNetUsers table and store it in my Student table during the registration process.

How do I get the userId of the newly created user (not the logged in user) from the AspnetUsers table and store it in a seperate table DURING the registration process?

My controller:

```<code>public ActionResult Create(ExpandedUserDTO paramExpandedUserDTO)
{
    try
    {
        if (paramExpandedUserDTO == null)
        {
            return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
        }

        var Email = paramExpandedUserDTO.Email.Trim();
        var UserName = paramExpandedUserDTO.Email.Trim();
        var Password = paramExpandedUserDTO.Password.Trim();

        UserName = Email.ToLower();

        // Create user

        var objNewAdminUser = new ApplicationUser { UserName = UserName, Email = Email};

        var AdminUserCreateResult = UserManager.Create(objNewAdminUser, Password);

        if (AdminUserCreateResult.Succeeded == true)
        {
            string strNewRole = Convert.ToString(Request.Form["Roles"]);

            if (strNewRole != "0")
            {
                // Put user in role
                UserManager.AddToRole(objNewAdminUser.Id, strNewRole);

                //Put user in student table
                if (strNewRole == "Student")
                {

                }
            }

            return Redirect("~/Admin");
        }
    }
    catch (Exception ex)
    {
        ViewBag.Roles = GetAllRolesAsSelectList();
        return View("Create");
    }
}
</code>```

答:
```<code>you can try this

if(AdminUserCreateResult.Succeeded == true)
{
//Get Details of currently registered User
    var RegisteredUser= SignInManager.UserManager.FindByEmail(Email);
//Extract userid from user Details.
    var userid=RegisteredUser.Id;
//this will give you the ID stored in aspnetusers of currentUser
}
</code>```

Body:
Im trying to get the userId stored in the AspNetUsers table and store it in my Student table during the registration process.

How do I get the userId of the newly created user (not the logged in user) from the AspnetUsers table and store it in a seperate table DURING the registration process?

My controller:

public ActionResult Create(ExpandedUserDTO paramExpandedUserDTO)
{
    try
    {
        if (paramExpandedUserDTO == null)
        {
            return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
        }

        var Email = paramExpandedUserDTO.Email.Trim();
        var UserName = paramExpandedUserDTO.Email.Trim();
        var Password = paramExpandedUserDTO.Password.Trim();

        UserName = Email.ToLower();

        // Create user

        var objNewAdminUser = new ApplicationUser { UserName = UserName, Email = Email};

        var AdminUserCreateResult = UserManager.Create(objNewAdminUser, Password);

        if (AdminUserCreateResult.Succeeded == true)
        {
            string strNewRole = Convert.ToString(Request.Form["Roles"]);

            if (strNewRole != "0")
            {
                // Put user in role
                UserManager.AddToRole(objNewAdminUser.Id, strNewRole);

                //Put user in student table
                if (strNewRole == "Student")
                {

                }
            }

            return Redirect("~/Admin");
        }
    }
    catch (Exception ex)
    {
        ViewBag.Roles = GetAllRolesAsSelectList();
        return View("Create");
    }
}


问:
Http load testing with bytes counting
I need some possibility to conduct load testing of our REST API with traffic counting.

For example to run 20 concurrent user for 1 hour. As a result I want to get information about responses (avg time, delays, etc) and overall traffic that has been produced.

I overlooked JMeter and Gatling, but found no possibilities to count bytes.

I don't really need big amount of concurrent users (100 would be enough) and high throughput (more than 10 requests per second from single user).

My goal is just to produce some load on our system and to check that it shows correct statistic data.

答:
JMeter (checked with latest 3.3) already save sent/received bytes by default, you can see in Listener's Configure button:

```<code>Save sent bytes count

Save received bytes count
</code>```

You will get in jtl file saved columns ..,bytes,sentBytes..

Title: Http load testing with bytes counting

Body:
JMeter (checked with latest 3.3) already save sent/received bytes by default, you can see in Listener's Configure button:

Save sent bytes count

Save received bytes count

You will get in jtl file saved columns ..,bytes,sentBytes..


问:
babel-plugin-react-css-modules import is not work in less-loader
i try use @import is not working。

```<code>  // a.less
  .hello{width:100px;height:100px;background:blue;}

  // index.less
  @import './a.less'

  // App.jsx
  import './index.less';
  <div styleName="hello"></div>
</code>```

ERROR:

```<code>ERROR in ./src/App.jsx
Module build failed: Error: D:/workspace_js/react-redux-boilerplate/src/App.jsx: Could not resolve the styleName 'hello'.
    at styleNameValue.split.filter.map.styleName (D:\workspace_js\react-redux-boilerplate\node_modules\babel-plugin-react-css-modules\dist\getClassNam
e.js:83:15)
    at Array.map (<anonymous>)
    at exports.default (D:\workspace_js\react-redux-boilerplate\node_modules\babel-plugin-react-css-modules\dist\getClassName.js:66:6)
    at exports.default (D:\workspace_js\react-redux-boilerplate\node_modules\babel-plugin-react-css-modules\dist\resolveStringLiteral.js:27:56)
    at PluginPass.JSXElement (D:\workspace_js\react-redux-boilerplate\node_modules\babel-plugin-react-css-modules\dist\index.js:183:46)
    at newFn (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\visitors.js:276:21)
    at NodePath._call (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\path\context.js:76:18)
    at NodePath.call (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\path\context.js:48:17)
    at NodePath.visit (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\path\context.js:105:12)
    at TraversalContext.visitQueue (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\context.js:150:16)
    at TraversalContext.visitMultiple (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\context.js:103:17)
    at TraversalContext.visit (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\context.js:190:19)
    at Function.traverse.node (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\index.js:114:17)
    at NodePath.visit (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\path\context.js:115:19)
    at TraversalContext.visitQueue (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\context.js:150:16)
    at TraversalContext.visitSingle (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\context.js:108:19)
 @ ./src/index.jsx 14:0-24 28:2-30:4 28:29-30:3
 @ multi webpack-hot-middleware/client?reload=true react-hot-loader/patch webpack/hot/only-dev-server ./src/index.jsx
</code>```

this is test demo : git@github.com:ganxunzou/react-redux-boilerplate.git

test setp:

clone git@github.com:ganxunzou/react-redux-boilerplate.git

git checkout css-module-less-postcss

npm i

npm run dev

答:
try use @import is not working。

Mentioned error can be caused by different factors. Firstly, provided webpack.config does not include any loader for .less css-files, so ensure to add appropriate loader into config: https://github.com/webpack-contrib/less-loader

Secondly, styles can be wrapped in independent namespaces, which is useful to avoid collisions between components - so ensure, that generated scope is used property

Body:
i try use @import is not working。

  // a.less
  .hello{width:100px;height:100px;background:blue;}

  // index.less
  @import './a.less'

  // App.jsx
  import './index.less';

ERROR:

ERROR in ./src/App.jsx
Module build failed: Error: D:/workspace_js/react-redux-boilerplate/src/App.jsx: Could not resolve the styleName 'hello'.
    at styleNameValue.split.filter.map.styleName (D:\workspace_js\react-redux-boilerplate\node_modules\babel-plugin-react-css-modules\dist\getClassNam
e.js:83:15)
    at Array.map (<anonymous>)
    at exports.default (D:\workspace_js\react-redux-boilerplate\node_modules\babel-plugin-react-css-modules\dist\getClassName.js:66:6)
    at exports.default (D:\workspace_js\react-redux-boilerplate\node_modules\babel-plugin-react-css-modules\dist\resolveStringLiteral.js:27:56)
    at PluginPass.JSXElement (D:\workspace_js\react-redux-boilerplate\node_modules\babel-plugin-react-css-modules\dist\index.js:183:46)
    at newFn (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\visitors.js:276:21)
    at NodePath._call (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\path\context.js:76:18)
    at NodePath.call (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\path\context.js:48:17)
    at NodePath.visit (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\path\context.js:105:12)
    at TraversalContext.visitQueue (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\context.js:150:16)
    at TraversalContext.visitMultiple (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\context.js:103:17)
    at TraversalContext.visit (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\context.js:190:19)
    at Function.traverse.node (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\index.js:114:17)
    at NodePath.visit (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\path\context.js:115:19)
    at TraversalContext.visitQueue (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\context.js:150:16)
    at TraversalContext.visitSingle (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\context.js:108:19)
 @ ./src/index.jsx 14:0-24 28:2-30:4 28:29-30:3
 @ multi webpack-hot-middleware/client?reload=true react-hot-loader/patch webpack/hot/only-dev-server ./src/index.jsx

this is test demo : git@github.com:ganxunzou/react-redux-boilerplate.git

test setp:

clone git@github.com:ganxunzou/react-redux-boilerplate.git

git checkout css-module-less-postcss

npm i

npm run dev


问:
Web service response for Null DateTime?
When a web service contains a DateTime datatype and the datatime has not been set, ie its a null value. What is the standard response provided by the web service?

1)    <Timestamp>1900-01-01T00:00:00.0000000+10:00</Timestamp>

OR

2) <Timestamp></Timestamp>

答:
The standard response would be to not return the element. If it's an attribute, then the response would be to not include the attribute.

There are no good reasons to include an empty element.

Title: Web service response for Null DateTime?


问:
While loading data using Apache Pig to Hbase table, How to exclude columns where there is no data (just whitespace) in csv or text file for a row?
Consider I have a table called customer_table with data as column family, Now I have a text file as follows:

custno,firstname,lastname,age,profession

( These are column names and not present in the text or csv file)

```<code>1,John,Wright,54,Coach
2,Luke,,20,Student
3,Mike,Jordan,26,
4,William,Jones,21,Teacher
</code>```

Here in the 2nd row and 3rd row there is no value for the column's lastname and profession respectively.

Now i want

```<code>STORE variable INTO 'hbase://customer_table' USING org.apache.pig.backend.hadoop.hbase.HBaseStorage()
</code>```

to exclude those columns(where there is no data or only whitespace) for that particular rows alone. Please let me know how this can be done.

答:
You could use nested biconditionals in foreach ... generate statements. Another option would be to use UDF.

As a remark, either way, you will lose a schema so your fields will be nameless and values will be bytearrays in pig. I personally never tried writing such rows to hbase. Therefore no idea, how they will look like and how could you access them. I hope you have a good reason for doing something like this.

Body:
Consider I have a table called customer_table with data as column family, Now I have a text file as follows:

custno,firstname,lastname,age,profession

( These are column names and not present in the text or csv file)

1,John,Wright,54,Coach
2,Luke,,20,Student
3,Mike,Jordan,26,
4,William,Jones,21,Teacher

Here in the 2nd row and 3rd row there is no value for the column's lastname and profession respectively.

Now i want

STORE variable INTO 'hbase://customer_table' USING org.apache.pig.backend.hadoop.hbase.HBaseStorage()

to exclude those columns(where there is no data or only whitespace) for that particular rows alone. Please let me know how this can be done.